Get unlimited public & private packages + team-based management with npm Teams.Learn more »

@ctmobile/ui-draglayout-sd

1.0.1 • Public • Published

DragLayout

基本布局

常见的布局如下:


  <div class="ct-draglayout">
    <div class="ct-draglayout-slave" style="width: 60%;">
      我是隐藏的面板
    </div>
    <div class="ct-draglayout-master">
      我是主面板
    </div>
  </div>

  • ct-draglayout - 代表是一个draglayout组件
    • ct-draglayout-master - 代表主面板
    • ct-draglayout-slave - 代表副面板

初始化


  import DragLayout from '@ctmobile/ui-draglayout';
  const draglayout = DragLayout(el);

例子

html


          <div class="ct-draglayout" id="ct-draglayout-demo">
            <div class="ct-draglayout-slave" style="width: 60%;">
              我是隐藏的面板
            </div>
            <div class="ct-draglayout-master">
              我是主面板
            </div>
          </div>

js


          import DragLayout from '@ctmobile/ui-draglayout';
          DragLayout($('#ct-draglayout-demo')[0],{
            showCallback() {
              console.log('show');
            },
            hideCallback() {
              console.log('hide');
            }
          });

方法

show() - 显示

hide() - 隐藏

isShow() - 收显示

Install

npm i @ctmobile/ui-draglayout-sd

DownloadsWeekly Downloads

3

Version

1.0.1

License

MIT

Unpacked Size

28.9 kB

Total Files

5

Last publish

Collaborators

  • avatar