Splitter

생성 옵션

  <div id="horizontal-splitter" style="height: 300px">
    <div id="frame1">
      HORIZONTAL TOP PANEL
    </div>
    <div id="frame2">
      <div id="vertical-splitter" style="height: 100%">
        <div id="frame3">
          VERTICAL LEFT PANEL
        </div>
        <div id="frame4">
          VERTICAL RIGHT PANEL
        </div>
      </div>
    </div>
  </div>

  Gn.create('splitter', {
    target: '#horizontal-splitter',
    panel: ['#frame1','#frame2'],
    position: '30%',
    onDrag: function(e) {
      console.log('dragging');
    },
    onDragStart: function(e) {
      console.log('drag start');
    },
    onDragEnd: function(e) {
      console.log('drag End');
    }
  });
  Gn.create('splitter', {
    target: '#vertical-splitter',
    panel: ['#frame3','#frame4'],
    space: 20,
    orientation: 'vertical'
  });