UNPKG

jqwidgets-framework

Version:

jQWidgets is an advanced jQuery, Angular, React, ASP .NET MVC, Custom Elements and HTML5 UI framework.

36 lines 1.43 kB
<!DOCTYPE html> <html lang="en"> <head> <meta name="keywords" content="jQuery Splitter, Splitter Widget, Splitter, jqxSplitter" /> <meta name="description" content="This page demonstrates splitter's events" /> <title id='Description'>This demonstration shows how to create a splitter that fits the entire browser window's contents. </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/jqxsplitter.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#splitter').jqxSplitter({ width: '100%', height: '100%', panels: [{ size: '20%', min: 150 }, { size: '80%', min: 250}] }); }); </script> <style type="text/css"> html, body { height: 100%; width: 100%; margin: 0px; padding: 0px; overflow: hidden; } </style> </head> <body> <div id='splitter'> <div></div> <div></div> </div> </body> </html>