javascript - 在 IE9 上滚动字幕文本换行

Question

我正在处理滚动选取框 SharePoint Web 部件。 Web 部件在此处使用循环插件 (http://jquery.malsup.com/cycle/)

文本将向下滚动到底部并重新出现在顶部。它在 IE8 中按预期工作。但是在IE9中，有些字符串会有问题。 (例如 5 月 9 日的 UAT 测试)当文本重新出现在顶部时，它会因未知原因而被换行。

fiddle 链接在这里:

http://jsfiddle.net/9PK6z/18/

见下图:

这是脚本的一部分:

<div id='ticker_10eb4222-addd-4f86-8d84-94926eae0aa2' class='ticker' style='position: relative; width: 530px; height: 60px; overflow: hidden;'>
<ul class="list-style1"><li><span>UAT Testing on 1 Aug</span></li></ul>
</div>

</div>
<script type="text/javascript">

$(document).ready(function() { 
    for(var i =0; i<2; i++) { 
        $('#ticker_10eb4222-addd-4f86-8d84-94926eae0aa2')
        .find("ul")
        .clone()
        .appendTo($('#ticker_10eb4222-addd-4f86-8d84-94926eae0aa2')); 
    } 

    $('#ticker_10eb4222-addd-4f86-8d84-94926eae0aa2')
        .cycle({ fx: 'scrollVert', continuous: 1, speed: $('#ticker_10eb4222-addd-4f86-8d84-94926eae0aa2')
        .find("ul:eq(0) li").size() * 3000, delay: 0, easing: 'linear', rev:0 }); 
}); 

</script> 

像“UAT Testing at 1 Aug”这样的字符串不会有问题。我已经尝试了很多组合仍然没有找到模式。IE9 中的哪些变化导致了这个问题？

Answer 1

根据您的 fiddle ，它似乎是 overflow css 属性的问题。

我发现通过将 overflow 从 #ticker 元素切换到 ul 元素，它开始起作用

.bochk-list-style1 {
    background-color:#ffffb6;
    overflow: hidden;
}
#ticker {
    border:1px solid black;
}

我在 Chrome 和 IE9 中测试过，它似乎工作正常

Fiddle