-1 

      $(document).ready(function(e){ 
$('#boxL').slimscroll({
    color: '#212121',
    position:'right',
     distance : '0px',
    size: '10px',
    height: '800px',
    width:'200px',
    alwaysVisible: true
});
});

    $(document).ready(function(e){ 
$('#boxC').slimscroll({
    color: '#212121',
    position:'right',
     distance : '0px',
    size: '10px',
    height: '800px',
    width:'200px',
    alwaysVisible: true
});
});



    $(document).ready(function(e){ 
$('#boxR').slimscroll({
    color: '#212121',
    position:'right',
     distance : '0px',
    size: '10px',
    height: '800px',
    width:'200px',
    alwaysVisible: true
});
});
* {
  box-sizing:border-box;  
}

.bloqueL {
  border:1px solid #000;
  padding:10px;
display:inline-block;

}
.bloqueC {
  border:1px solid #000;
  padding:10px;
display:inline-block;


}
.bloqueR {
  position:absolute;
  top:0px;
  right:0px;
  border:1px solid #000;
  padding:10px;
display:inline-block;

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="http://madeindreams.ca/JS/jquery.slimscroll.min.js"></script>

<body>
  <div id="boxL" class="bloqueL" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="dragLeave(event)">
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
    x<br>
  </div>
  
  <div id="boxC" class="bloqueC" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="dragLeave(event)">
      </div>
  
    <div id="boxR" class="bloqueR" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="dragLeave(event)">
      </div>
</body>

Slimscrollを見つけて試してみました。動作するデモを表示するサイトでは、スクロール バーがコンテナーに取り付けられています。でもやってみると。スクロールバーは右端まで。

私は3つのコンテナを持っていて、最終的にページに

3 つのコンテナーを同じ行に配置したいと考えています。しかし、slimscroll のおかげで、それらは次々と表示されます。

位置を絶対に設定しても機能しません。

4

1 に答える 1