jqwidgets-framework
Version:
jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.
82 lines (78 loc) • 4.3 kB
HTML
<html lang="en">
<head>
<meta name="keywords" content="jqxDocking, jQuery Docking, jQWidgets, Events" />
<meta name="description" content="jqxDocking has events which are connected with some actions on the windows inside. Common events which probably you'll need
to handle are the dragEnd and dragStart event. You can see these events down in the demo." />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title id='Description'>Docking Keyboard Navigation.</title>
<link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />
<script type="text/javascript" src="../../../scripts/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxwindow.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdocking.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxpanel.js"></script>
<script type="text/javascript" src="../../../scripts/demos.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#docking').jqxDocking({ keyboardNavigation: true, orientation: 'horizontal', width: getWidth('docking'), mode: 'default' });
$("#docking").jqxDocking('showAllCollapseButtons');
$("#docking").jqxDocking('focus');
});
</script>
</head>
<body class='default'>
<div id="docking">
<div>
<div id="window0" style="height: 150px">
<div>
CISC
</div>
<div>
Before the RISC philosophy became prominent, many computer architects tried to bridge
the so called semantic gap, i.e. to design instruction sets that directly supported
high-level programming constructs such as procedure calls, loop control, and complex...
</div>
</div>
<div id="window1" style="height: 150px">
<div>
Database management system
</div>
<div>
A database management system (DBMS) is a software package with computer programs
that control the creation, maintenance, and the use of a database. It allows organizations
to conveniently develop databases...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>
RISC
</div>
<div>
Some aspects attributed to the first RISC-labeled designs around 1975 include the
observations that the memory-restricted compilers of the time were often unable
to take advantage...
</div>
</div>
</div>
</div>
<br />
<br />
<ul>
<li><b>Tab</b> - Once the focus is received, users will be able to use the keyboard to change the focused Docking Panel.</li>
<li><b>Shift+Tab</b> - reverses the direction of the tab order. Once in the widget, a Shift+Tab will take the user to the previous Docking Panel.</li>
<li><b>Esc</b> - closes the focused Docking Panel.</li>
<li><b>Enter</b> - collapses/expands the focused Docking Panel.</li>
</ul>
<div style="position: absolute; bottom: 5px; right: 5px;">
<a href="https://www.jqwidgets.com/" alt="https://www.jqwidgets.com/"><img alt="https://www.jqwidgets.com/" title="https://www.jqwidgets.com/" src="https://www.jqwidgets.com/wp-content/design/i/logo-jqwidgets.png"/></a>
</div>
</body>
</html>