总是在字幕中显示文字

我的目标是始终在没有空格的标签字幕上显示文字。文字应该始终显示在这个通常的动画中。总是在字幕中显示文字

我的目标是始终显示在我的标签滚动字幕文本无空格。文字应该始终显示在这个通常的动画中。在我的真实项目中，我经常收到推文，并且将它们放入跑马灯中，我删除了第一张，然后在金额为5的情况下制作了一个.append（如果10条推文到达一个不太好的解决方案第二，用户无法很好地阅读选取框，我想在选取框内有5个跨度，在某个时候，我的网页开始变慢，通过不断执行.append和多个跨度元素）。

在设定的时间间隔中，我仿佛收到推文，但在某一时刻动画不是流畅的，或重新开始显示空格。我想显示的唯一空间是最初的，否则我不想显示空格。

我不知道如何解决这个问题，或者如果有一个事件或事情我可以做的，当第一跨度离开容器，以添加新元素检测和可阅读好选择。

我试过了几个库，但没有一个适合我的问题。我希望你能帮助我。

http://jsfiddle.net/fq2z6o99/

<div id='container_marquee'> 
    <marquee id='mymarquee' behavior="scroll" onmouseover="this.stop();" onmouseout="this.start();"> 
       <span>first marquee text</span> 
       <span>second marquee text</span> 
       <span>third marquee text</span> 
       <span>fourth marquee text</span> 
       <span>fifth marquee text</span> 
    </marquee> 
    </div>

来源

2017-08-31 yavg

https://stackoverflow.com/questions/21427999/how-to-remove-trailing-space-from-marquee你试过了吗？ – Shubhranshu

选取框标记已过时 - 您最好编写代码来完成选取框的功能，然后您可以做到这一点betterer –

@Shubhranshu http://jsfiddle.net/rt87hdv5/我已经重新创建了解决方案，但我不知道如何在我的真实例子中添加短语，也许你可以帮助我。 – yavg

使用选取框行为=备用

来源

2017-08-31 04:58:55

我已经看到它是如何工作的，但它不能解决我的问题。 – yavg

https：//www.stevesouders。com/blog/2010/05/11/appendchild-vs-insertbefore/ –

我已动态添加第六滚动字幕文本。尝试了这样的事情。希望对你有帮助...！与此

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script type='text/javascript' src='//cdn.jsdelivr.net/jquery.marquee/1.4.0/jquery.marquee.min.js'></script> 
 
<style> 
 
.marquee { 
 
    width: 300px; 
 
    overflow: hidden; 
 
    border: 1px solid #ccc; 
 
    background: #ccc; 
 
} 
 
.marquee span{ 
 
\t margin:0 15px; 
 
} 
 
</style> 
 
</head> 
 
<body> 
 
<div class="marquee"> 
 
\t <span>first marquee text</span> 
 
\t <span>second marquee text</span> 
 
\t <span>third marquee text</span> 
 
\t <span>fourth marquee text</span> 
 
\t <span>fifth marquee text</span> 
 
</div> 
 
</body> 
 
<script> 
 
$('.marquee').marquee({ 
 
    //speed in milliseconds of the marquee 
 
    duration: 5000, 
 
    //gap in pixels between the tickers 
 
    gap: 50, 
 
    //time in milliseconds before the marquee will start animating 
 
    delayBeforeStart: 100, 
 
    //'left' or 'right' 
 
    direction: 'left', 
 
    //true or false - should the marquee be duplicated to show an effect of continues flow 
 
    duplicated: true 
 
}); 
 
$(".marquee span:last-child").after("<span>Sixth marquee text</span>"); 
 
</script> 
 
</html>

来源

2017-08-31 06:53:41

我最初尝试使用这个插件。但是，如果您在动态添加文本时不能停止或重新开始动画，我将选择您作为最佳答案。 – yavg

这将是非常有用的，但正如我所说，我需要添加一个句子，而无需重新启动整个选框 – yavg

我的意思是，选框重新启动之前显示新添加的句子http://jsfiddle.net/pt4rwo35/ – yavg

您可以编写自定义jQuery代码再次尝试更换字幕标记。

试试下面的代码可能是它可以帮助你：

<html> 
<head> 
<style> 
* { 
    margin:0; padding:0 
} 
div { 
    background: white; 
    width: 600px; 
    height: 40px; 
    border: 2px solid red; 
} 
div p { 
    position: relative; 
} 
</style> 
</head 
<body> 
<div> 
    <p>Lorem ipsum dollar sit, lorem ipsum dollar</p> 
</div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script> 
var animation = function() { 
    $('div p').animate({left: '320'}, 5000, 

    function() { 
     $('div p').animate({left: '0'}, 5000); 
     animation(); 
    }); 
}; 

animation(); 

</script> 
</body> 
</html>

来源

2017-08-31 10:10:54

总是在字幕中显示文字

回答

相关问题