jquery / css:使div内的文本水平滚动,就像新闻自动收报机没有插件一样

前端之家收集整理的这篇文章主要介绍了jquery / css:使div内的文本水平滚动,就像新闻自动收报机没有插件一样前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
任何人都有一些提示,如何在“新闻自动收报机”的方式从右到左水平地在div内滚动文本而不必使用插件.以下是我正在尝试完成的示例(这是一个插件解决方案: http://www.maaki.com/scrollingText.html).

解决方法

这是一个快速解决方案:
http://jsfiddle.net/4mTMw/8/
var marquee = $('div.marquee');
marquee.each(function() {
    var mar = $(this),indent = mar.width();
    mar.marquee = function() {
        indent--;
        mar.css('text-indent',indent);
        if (indent < -1 * mar.children('div.marquee-text').width()) {
            indent = mar.width();
        }
    };
    mar.data('interval',setInterval(mar.marquee,1000/60));
});​

使用text-indent css属性,您可以相当简单地执行此操作.

猜你在找的jQuery相关文章