jQuery - ScrollUpBar Plugin插件，滚动隐藏/回滚显示

 上一篇文章分享了《jQuery - 下拉滚动隐藏/回滚显示- 特效代码》，本文再次分享一种实现的jQuery插件，ScrollUpBar Plugin插件，可以滚动隐藏和回滚、滚动显示！

代码分享：

!doctype html>
    html>
    head>
    meta charset="utf-8">
    title>
    滚动隐藏，回滚显示/title>
    style>
 *{
    padding: 0;
    margin: 0;
text-align: center}
 .nav{
    width: 100%;
     background-color:blue;
     color:#fff;
     font-size:24px;
     padding:5px;
      position: fixed;
     top:0;
     left:0;
    right: 0;
     /*  transition: top .5s;
*/ }
 .text{
}
    /style>
    /head>
    body>
    div class="top">
     顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    顶部的文字说明啊br>
    /div>
    div  class="nav" >
     滚动显示或隐藏的菜单文字、菜单文字、菜单文字/div>
    div  class="text">
     下拉测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    下拉测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    下拉测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    下拉测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    测试文字br>
    /div>
    script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
    /script>
    script src="scroll-up-bar.js">
    /script>
    script>
        $('.nav').scrollupbar();
      /script>
    /body>
    /html>
    

其中的scroll-up-bar.js下载：

ScrollUpBar Plugin.zip

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！