1. 程式人生 > 實用技巧 >js簡單外掛類

js簡單外掛類

//資料滾動 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)
}