javascript – 将文本保留在选取框中

我的目标是始终在没有空格的情况下在我的选框上显示文字.在这个通常的动画中应始终显示文本.

《javascript – 将文本保留在选取框中》

在这个通常的动画中应始终显示文本.在我的真实项目中,我经常接收推文,我将它们放在选框中,我删除了第一个,然后只要数量为5就制作.append(不是一个好的解决方案,如果10个推文到达第二,用户无法很好地阅读选框.我希望在选框内有5个跨度,在某个时刻我的网页开始变慢,不断执行.append并且有很多span元素).

使用设置的间隔,我正在模拟,好像收到了推文,.我想要展示的唯一空间是初始,否则我不想显示空格.

《javascript – 将文本保留在选取框中》

我正在使用这个库:
https://github.com/aamirafridi/jQuery.Marquee

当我尝试添加一个新短语时,我的问题就出现了,动画过早地结束了.我怎么解决这个问题?
在显示新添加的句子之前,选框重新启动.也许我没有以正确的方式做到这一点.

http://jsfiddle.net/pt4rwo35/

<div class="marquee">
 <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>
</div>

$(".marquee span:last-child").after("<span> Sixth marquee text</span>");

我想要在动态添加的文本结束时准确检测到它.但由于某种原因,动画重新启动

最佳答案 是否可以在添加新文本后调用选取框功能?我认为当调用marquee函数来测量当前字符数时会发生一些事情.如果尚未添加文本,则尚未添加这些字符.

$.when( $(".marquee span:last-child").after("<span>Sixth marquee text</span>") ).then(function() {
  $('.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')
    .bind('finished', function(){
        //Change text to something else after first loop finishes
        console.log('restart')
})
点赞