多项列表无限滚动

来源:互联网 发布:手机拍照滤镜软件 编辑:程序博客网 时间:2024/06/13 22:21


<div class="award_wrap   award-on">
                        <ul class="award">
                            <%--<li class='center'>暂无中奖记录</li>--%>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中50元话费券</label></li>
                            <li><span>b***m</span><label>抽中九阳原汁机</label></li>
                            <li><span>b***n</span><label>抽中格力空调扇</label></li>
                            <li><span>b***n</span><label>抽中美的电烤箱</label></li>
                            <li><span>b***n</span><label>抽中小米充电宝</label></li>
                            <li><span>b***n</span><label>抽中小米电视</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                            <li><span>b***n</span><label>抽中5元返金券</label></li>
                        </ul>
                    </div>


//文字滚动
    $('.award_wrap').myScroll({
        speed: 40, //数值越大,速度越慢
        rowHeight: 47 //li的高度
    });


 //切换选项卡
    $(".recordhd span").click(function () {
        $(".recordhd span").eq($(this).index()).addClass('on').siblings().removeClass("on");
        $('.record .award_wrap').hide().eq($(this).index()).show();
        $('.award_wrap').eq($(this).index()).mouseleave();//因为中奖纪录跟我的奖品是无限滚动的,所以切换选项卡要加这句话
    });


(function ($) {
    //var currentUserId = getUserId();
    var currentUserId = 15;
    alert(currentUserId);
    $('#hiddenUserId').val(currentUserId);
    $.fn.myScroll = function (options) {
        //默认配置
        var defaults = {
            speed: 40,  //滚动速度,值越大速度越慢
            rowHeight: 47 //每行的高度
        };


        var opts = $.extend({}, defaults, options), intId = [];


        function marquee(obj, step) {


            obj.find("ul").animate({
                marginTop: '-=1'
            }, 0, function () {
                var s = Math.abs(parseInt($(this).css("margin-top")));
                if (s >= step) {
                    $(this).find("li").slice(0, 1).appendTo($(this));
                    $(this).css("margin-top", 0);
                }
            });
        }


        this.each(function (i) {
            var sh = opts["rowHeight"], speed = opts["speed"], _this = $(this);
            intId[i] = setInterval(function () {
                if (_this.find("ul").height() <= _this.height()) {
                    clearInterval(intId[i]);
                } else {
                    marquee(_this, sh);
                }
            }, speed);


            _this.hover(function () {
                clearInterval(intId[i]);
            }, function () {
                intId[i] = setInterval(function () {
                    if (_this.find("ul").height() <= _this.height()) {
                        clearInterval(intId[i]);
                    } else {
                        marquee(_this, sh);
                    }
                }, speed);
            });


        });


    }
})(jQuery);




原创粉丝点击