使用css自定义滚动条滑块位于底部

时间:2018-03-05 04:49:04

标签: html css

只需使用css和webkit,滚动条拇指是否可以默认位于页面底部。我使用jquery这样做,但这并没有给我想要的结果,我想用css做它

这是我的css代码

.container::-webkit-scrollbar {
width: 12px;
background-color: #000000;
 }
.container::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  background-color: #F5F5F5;
}

.container::-webkit-scrollbar-thumb {

  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #555;
}

这是我用来实现这个的jquery代码

<script type="text/javascript">
  var refreshIntervalId=null;
  refreshIntervalId =  setInterval(function(){
      var element = document.getElementsByClassName('container')[0];
      if (element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth) {
        $('#mydiv').animate({
                   scrollTop: $(document).height()
               },
                'slow');
               return false;
      }
    }, 100);
</script>

1 个答案:

答案 0 :(得分:0)

如果你有jQuery,你可以这样做 -

$('html,body').animate({scrollTop: document.body.scrollHeight},"slow");

就是这样。