js简单插件类

Posted 2020-12-18 .NET求学者

 

//数据滚动 div框 ul滚动 li
(function ($) {
    $.fn.myScroll = function (options) {
        //默认配置
        var defaults = {
            speed: 40,  //滚动速度,值越大速度越慢
            rowHeight: 24 //每行的高度
        };

        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).children("li:first").remove();
                    //$(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 () {
                clearInterval(intId[i]);
                intId[i] = setInterval(function () {
                    if (_this.find("ul").height() <= _this.height()) {
                        clearInterval(intId[i]);
                    } else {
                        marquee(_this, sh);
                    }
                }, speed);
            });

        });

    }

})(jQuery);

//调用
 var scrollOpt = {
                        speed: 40,  //滚动速度,值越大速度越慢
                        rowHeight: 40 //每行的高度
                    }
$(‘#div_gridBody‘).myScroll(scrollOpt);

 

var pic = $("pic");
var leader = 0;
var target = 0;
var timer = null; // 定时器
var top = pic.offsetTop; // 50
window.onscroll = function() {
    clearInterval(timer);
    target = scroll().top + top; // 把最新的 scrolltop 给  target
    timer = setInterval(function() {
        leader = leader + (target - leader) / 10;
        pic.style.top = leader + ‘px‘;
    }, 30)
}