JavaScript Splitter

Set the resizable property of the jqxSplitter. Author: http://jqwidgets.com

by Pfhoenix

HTML

<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id='jqxSplitter'>
  <div style="background-color: #97FFAF">
    <div id="list" style="margin-top: 5px">
    </div>
  </div>
  <div style="background-color: #E8C0AF"></div>
</div>

JavaScript

$("#jqxSplitter").jqxSplitter({
  width: '100%',
  height: '500px',
  theme: 'arctic'
});

var source = [
  "Affogato",
  "Americano",
  "Bicerin",
  "Breve",
  "Café Bombón",
  "Café au lait",
  "Caffé Corretto",
  "Café Crema",
  "Caffé Latte",
  "Caffé macchiato",
];

$("#list").jqxListBox({
  source: source,
  width: '100%',
  height: '100%'
});