Jquery:控制多个新闻滚动条

Question

我正在使用 jQuery 新闻行情 plugin 。它工作正常，但是当我在页面中放置多个新闻滚动条时，新闻滚动条 control(start,stop,next/pre) 不起作用。当我单击控件 1 时，该控件适用于所有新闻收报机框，但需要为每个框使用 control 。 即:control1 对应 box1，control2 对应 box2。如何解决这个问题？ ONLINE DEMO (实际操作中，请单击第一个控制栏。)

HTML:

<ul id="vertical-ticker">
            <li>One Time</li>
            <li>Baby</li>
            <li>One Less Lonely Girl</li>
            <li>Somebody to Love</li>
            <li>Eenie Meenie</li>
            <li>Never Say Never</li>
            <li>U Smile</li>
</ul>
<p><a href="#" id="ticker-previous">Previous</a> / <a href="#" id="ticker-next">Next</a> / <a id="stop" href="#">Stop</a> / <a id="start" href="#">Start</a></p>
<ul id="vertical-ticker1">
            <li>One Time</li>
            <li>Baby</li>
            <li>One Less Lonely Girl</li>
            <li>Somebody to Love</li>
            <li>Eenie Meenie</li>
            <li>Never Say Never</li>
            <li>U Smile</li>
</ul>
    <p><a href="#" id="ticker-previous">Previous</a> / <a href="#" id="ticker-next">Next</a> / <a id="stop" href="#">Stop</a> / <a id="start" href="#">Start</a></p>

JQUERY:

$(function(){
            $('#vertical-ticker').totemticker({
                row_height  :   '100px',
                next        :   '#ticker-next',
                previous    :   '#ticker-previous',
                stop        :   '#stop',
                start       :   '#start',
                mousestop   :   true,
            });
        });
$(function(){
            $('#vertical-ticker1').totemticker({
                row_height  :   '100px',
                next        :   '#ticker-next',
                previous    :   '#ticker-previous',
                stop        :   '#stop',
                start       :   '#start',
                mousestop   :   true,
            });
        });

Answer 1

您有重复的 ID，例如 #ticker-next、#start、#stop 等。这些 ID 在HTML 和 jQuery 对象映射中。