javascript - HTML JS 和 CSS 列表选取框未正确显示

Question

我修改了一段代码，该代码显示滚动简单 HTML 列表的选取框。可以看看here :我有 3 个我无法解决的问题:

1. JS:我希望字幕显示文本从左边消失后再次从右边进入，就像一个连续的字幕，我该怎么做？

2. CSS:我注意到 (a) 字幕中的一些瑕疵，我认为这是由于字幕文本和 div 的边距/填充设置不正确造成的；和 (b) 较浅的蓝色 div 的阴影切过选框..(我认为这可能是 z-indez 问题？)。 (b) 出现在任何浏览器中，(a) 仅出现在 chrome 中，firefox 看起来不错。我该如何解决？

   这是一个截图:

3. 我可以成功地从我的数据库加载数据并将其附加到选取框。现在，我想每隔 X 秒“刷新”选取框的内容，在底部添加一个元素时删除列表的顶部元素是否可以，或者淡出、更新所有内容会更好，以及再次淡入？还有其他方法吗？

Answer 1

这是一个简单的 example处理从另一侧滚动它们。此外，如果您采用此方法，您也可以根据需要简单地在数组中添加或删除新元素。观看这个，大约 2 或 3 次，通过它会添加新元素。需要注意的一件重要事情是确保带有 id 文本的 div 的宽度比所有可见元素的长度加上一行中下一个元素的长度更宽。