0

私はlayout.jqueryプラグインを使用しています。Waste Pane 用のカスタム トグルを作成しようとしています。回転したテキスト div をトグルとして作成するにはどうすればよいですか。以下の添付画像を参照してください。 ここに画像の説明を入力

JSFIDDLE: https://jsfiddle.net/kap0e06s/3/

HTML:

<div class="myDiv" style="height:400px">
  <div class="ui-layout-center">Center</div>
  <div class="ui-layout-north">North</div>
  <div class="ui-layout-south">South</div>
  <div class="ui-layout-east">East</div>
  <div class="ui-layout-west">West</div>
</div>

JS:

  $('.myDiv').layout({
    resizeWhileDragging: true,
    sizable: false,
    animatePaneSizing: true,
    fxSpeed: 'slow',
    west__spacing_closed: 0,
    west__spacing_open: 0,
    north__spacing_closed: 0,
    north__spacing_open: 0,

  });
4

2 に答える 2

0

申し訳ありません... jsfiddle を正しく作成できませんでした。変更されたコードは次のとおりです: JS:

        // OUTER-LAYOUT
    $('.myDiv').layout({
      resizeWhileDragging: true,
      sizable: false,
          livePaneResizing:         true,
      animatePaneSizing: true,
      fxSpeed: 'slow',
      west__spacing_closed: 0,
      west__spacing_open: 0,
      north__spacing_closed: 0,
      north__spacing_open: 0,

      east__spacing_open: 50,

    });

CSS:

        body {
      background-color: white;
    }

    .ui-layout-center,
    .ui-layout-north,
    .ui-layout-south,
    .ui-layout-east,
    .ui-layout-west {
      border: 0px;
    }

    .ui-layout-toggler{
      background-image: url("http://placehold.it/50/ff9933/ffffff?text=Panel");

      }
于 2016-09-29T15:53:31.963 に答える