jquery滚动条

所属分类:UI-布局,滚动

 36216  350  查看评论 (6)
分享到微信朋友圈
X
jquery滚动条 ie兼容6

添加引用

<!--引入 滚动条 css-->
<link rel="stylesheet" href="css/common.css">
<!--引入 jQuery-->
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<!--引入 滚动条事件js-->
<script src="js/tinyscrollbar.js" type="text/javascript"></script>
<div id="scrollbar_test">
    <!--//滚动条样式,track为滚动条轨道,thumb为滚动按钮,end可以设置滚动按钮上或下的样-->
    <div class="scrollbar">
        <div class="track">
            <div class="thumb">
                <div class="end"></div>
            </div>
        </div>
    </div>
    
    <div class="viewport">
        <div class="overview" style="top: 0px;">
            这里是自定义内容...
        </div>
    </div>
</div>

初始化脚本

<script>
    $(document).ready(function(e) {
        $('#scrollbar_test').tinyscrollbar();
    });
</script>

============感谢网友 嗜啡者 提供的内容============

相关插件-布局,滚动

单页多用途 HTML5模板

单页多用途 HTML5模板
  布局
 40688  541

不错的保安类网站模板

不错的bootstrap自适应网站模板
  布局
 38427  466

jquery瀑布流

无限瀑布流
  布局
 73050  481

jquery ui 仿windows 桌面

jquery ui 仿windows 桌面
  布局
 57761  554

讨论这个项目(6)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    AllenE 0
    2017/4/8 9:37:44
    迷失丶心殇 0
    2016/8/31 16:08:24
    笑丶 0
    2016/3/1 14:03:26
    hwe 0
    2016/1/20 14:01:08

    ie7拖拽滚动条会选中内容,弄解决吗

    回复
    西瓜 0
    2015/11/10 9:11:44

    内容没高度不能超出viewport的高度当然不显示,超出viewport高度时才会出现滚动条。

    回复
    李晓艳-湖南好搜 0
    2015/10/27 13:10:24

    改变了viewport的高度后就不行了,这是为什么?

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复