; (function($) { $.fn.YlMarquee = function(o) { o = $.extend({ speed: 60, step: 3, vertical: false, width: 0, height: 0, visible: 3 }, o || {}); var wrap = $(this), ul = $("ul", wrap), sLi = $("li", ul), sLiSize = sLi.size(), v = o.visible, step = parseInt(o.step), i, cssPro, whiteSpace, scrollDirection, floatStyle, ulSize, wrapSize, scrollSize; if (sLiSize > v) { if (!o.vertical) { cssPro = "width"; scrollDirection = "left"; floatStyle = "left"; whiteSpace = "nowrap"; } else { cssPro = "height"; scrollDirection = "top"; floatStyle = "none"; whiteSpace = "normal"; } ul.append(sLi.slice(0, v).clone()); var li = $("li", ul), itemLen = li.size(); wrap.css({ "position": "relative", "overflow": "hidden", "z-index": "2" }); ul.css({ "position": "relative", "overflow": "hidden", "z-index": "1", "margin": "0", "padding": "0", "list-style-type": "none" }); li.css({ "position": "relative", "overflow": "hidden", "white-space": whiteSpace }); li.attr("style", li.attr("style") + ";" + "float:" + floatStyle); ulSize = getTotalSize(li); wrapSize = getTotalSize(li.slice(0, v)); scrollSize = getTotalSize(sLi); ul.attr("style", ul.attr("style") + ";" + cssPro + ":" + ulSize + "px"); wrap.attr("style", wrap.attr("style") + ";" + cssPro + ":" + wrapSize + "px"); o.width != 0 ? wrap.width(o.width) : ""; o.height != 0 ? wrap.height(o.height) : ""; var MyMar = setInterval(marquee, o.speed); ul.hover(function() { clearInterval(MyMar); }, function() { MyMar = setInterval(marquee, o.speed); }); }; function getTotalSize(el) { var tmpSize = 0; el.each(function() { tmpSize += o.vertical ? height($(this)) : width($(this)); }); return tmpSize; }; function marquee() { if (o.vertical) { if (wrap.scrollTop() >= scrollSize - parseInt(sLiSize)) { wrap.scrollTop(wrap.scrollTop() - scrollSize + step); } else { i = wrap.scrollTop(); i += step; wrap.scrollTop(i) } } else { if (wrap.scrollLeft() >= scrollSize - parseInt(sLiSize)) { wrap.scrollLeft(wrap.scrollLeft() - scrollSize + step); } else { i = wrap.scrollLeft(); i += step; wrap.scrollLeft(i); } } }; }; })(jQuery); function css(el, prop) { return parseInt(el.css(prop)) || 0; }; function width(el) { return el.outerWidth() + css(el, 'margin-left') + css(el, 'margin-right'); }; function height(el) { return el.outerHeight() + css(el, 'margin-top') + css(el, 'margin-bottom'); };