是否可以在jQuery中创建一个100％无缝的选框(或者只是
javascript,但jQuery优先)？
我做了一个简单的选框,向左移动,直到它离开屏幕,然后简单地跳转(当看不到),然后再次启动.不过,我会喜欢它不要等待.
我可以想到这样做的唯一方法是复制文本并将其放在第一个文本之后,然后再次交换.然而,我不知道如何在jQuery中实现这一点,我一直在看jQuery的.clone(),但是无法使其正常工作,一切都跳转.
有任何想法吗？
谢谢你的时间,
解决方法
给出以下标记：
<div id="marquee">My Text</div>
对于重复,我会做这样的事情：
$("#marquee").wrapInner("span"); // wrap "My Text" with a new span
$("#marquee").append($("#marquee span").clone().hide()); // now there are two spans with "My Text"
移动和交换跨度是很容易的.这是一个功能完整的例子：
$(function() {
var marquee = $("#marquee");
marquee.css({"overflow": "hidden","width": "100%"});
// wrap "My Text" with a span (old versions of IE don't like divs inline-block)
marquee.wrapInner("<span>");
marquee.find("span").css({ "width": "50%","display": "inline-block","text-align":"center" });
marquee.append(marquee.find("span").clone()); // now there are two spans with "My Text"
// create an inner div twice as wide as the view port for animating the scroll
marquee.wrapInner("<div>");
marquee.find("div").css("width","200%");
// create a function which animates the div
// $.animate takes a callback for when the animation completes
var reset = function() {
$(this).css("margin-left","0%");
$(this).animate({ "margin-left": "-100%" },3000,'linear',reset);
};
// kick it off
reset.call(marquee.find("div"));
});
免责声明：
我不建议任何专业网站.但是,如果你想重现一个复古的1990年代的样子,这可能是有用的.
