zoukankan      html  css  js  c++  java
  • 滚动浏览

    今天下午做了一个滚动浏览效果,贴在此,积累

    $(function(){
        /*
         * 滚动浏览
         */
         $.fn.autoScroll = function(o){
             o = $.extend({
                speed: 20,
                step : 1,
                up : null,
                down : null
            }, o || {});
             var wrap = $(this)[0],
                 u1 = $(this).children("ul:first")[0],
                 u2 = $(this).children("ul:last")[0],
                 timer = null,
                 scrollup = null,
                 oldSetp = o.step;
             
            var scrolldown = function(){
                    if(u1.offsetHeight-wrap.scrollTop<=0)
                    wrap.scrollTop-=u1.offsetHeight;
                    else{
                    wrap.scrollTop += o.step;
                    }
            };
            var sup = function(){
                    var mid = u2;
                    u1 = u2; u2 = mid;
                    wrap.scrollTop = $(u1).height();
                    return function(){
                            $("#test").html(wrap.scrollTop);
                            if(wrap.scrollTop<=0)
                            wrap.scrollTop = $(u1).height();
                            else{
                            wrap.scrollTop -= o.step;
                            }
                    }
            };

            o.up.bind("mousedown",function(){
                o.step = 8;
            }).bind("mouseup",function(){
                o.step = oldSetp;
            });

            o.down.bind("mousedown",function(){
                if(typeof scrollup != 'function') { scrollup = sup(); sup = null; }
                o.step = 8;
                clearInterval(timer);
                timer = setInterval(scrollup,o.speed);
            }).bind("mouseup",function(){
                o.step = oldSetp;
                clearInterval(timer);
                timer = setInterval(scrolldown,o.speed);  
            });

            var timer = setInterval(scrolldown,o.speed);
        
            wrap.onmouseover = function(){clearInterval(timer);};
            wrap.onmouseout = function(){timer = setInterval(scrolldown,o.speed);};
         };

        var reOrder = $("#recentOrder");
        $(".reorder",reOrder).autoScroll({up:$("#reUp"),down:$("#reDown")});

    })

  • 相关阅读:
    一个贼基础的 编码解码方式
    SQL 中循环、for循环、游标
    sql中判断是否存在 数据库、表、存储过程、函数
    sql 同步表或同步表的时候更改部分字段
    sql存储过程的建立
    POJ
    UCloud 的安全秘钥 (计蒜客初赛第五场)(待解决)
    UCloud 机房的网络搭建(计蒜客初赛第五场)
    2017 计蒜之道 初赛 第四场
    腾讯课堂的物理实验(2017计蒜客初赛第三场)
  • 原文地址:https://www.cnblogs.com/hemei/p/3712181.html
Copyright © 2011-2022 走看看