1

我正在使用类似的代码

<marquee behavior="slide" direction="up" scrollamount="3" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 3, 0);">
<div id="mdivx">
    <a href="art.php?code=W1"><img src="im/tart/W1.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W2"><img src="im/tart/W2.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W3"><img src="im/tart/W3.jpg" width="75px" align="middle"></a><br/><br/>                                                          <a href="art.php?code=W4"><img src="im/tart/W4.jpg" width="75px" align="middle"></a><br/><br/><a href="art.php?code=W5"><img src="im/tart/W5.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W6"><img src="im/tart/W6.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W7"><img src="im/tart/W7.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W8"><img src="im/tart/W8.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W9"><img src="im/tart/W9.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W10"><img src="im/tart/W10.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W11"><img src="im/tart/W11.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W12"><img src="im/tart/W12.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W13"><img src="im/tart/W13.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W14"><img src="im/tart/W14.jpg" width="75px" align="middle"></a><br/><br/>
</div>
</marquee>

我想使用一个按钮，这样当我单击该按钮时，字幕必须启动，而当我单击关闭按钮时，字幕必须停止。我可以使用 JavaScript 实现这一点吗？

4

3 回答 3

1

代码



<marquee behavior="scroll" direction="left" id="mymarquee">
<p>Go on... press the button!</p>
</marquee>
<input type="button" value="Stop Marquee" onClick="document.getElementById('mymarquee').stop();">
<input type="button" value="Start Marquee" onClick="document.getElementById('mymarquee').start();">

工作演示http://jsfiddle.net/cse_tushar/r4QpN/

于 2013-05-02T04:59:30.750 回答
1

停止选取框时会显示滚动条。使用 jQuery 版本 1.9.1

HTML

<marquee behavior="slide" direction="up" scrollamount="3" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 3, 0);"id="mymarquee">
<div id="mdivx">
    <a href="art.php?code=W1"><img src="im/tart/W1.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W2"><img src="im/tart/W2.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W3"><img src="im/tart/W3.jpg" width="75px" align="middle"></a><br/><br/>                                                          <a href="art.php?code=W4"><img src="im/tart/W4.jpg" width="75px" align="middle"></a><br/><br/><a href="art.php?code=W5"><img src="im/tart/W5.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W6"><img src="im/tart/W6.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W7"><img src="im/tart/W7.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W8"><img src="im/tart/W8.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W9"><img src="im/tart/W9.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W10"><img src="im/tart/W10.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W11"><img src="im/tart/W11.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W12"><img src="im/tart/W12.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W13"><img src="im/tart/W13.jpg" width="75px" align="middle"></a><br/><br/>
    <a href="art.php?code=W14"><img src="im/tart/W14.jpg" width="75px" align="middle"></a><br/><br/>
</div>
</marquee>
<div id="mdivx1">
</div>
        <br/> <input type="button" value="Stop Marquee" id="stop">
<input type="button" value="Start Marquee" id="start">

CSS

#mdivx1
{
    display:none;
    overflow-y: scroll;
    overflow: -moz-scrollbars-vertical;
    height:200px;
}

jQuery

$(document).ready(function(){
    $('#mdivx1').hide();
    $('#stop').click(function(){
        $('#mymarquee').hide();
        $('#mdivx1').show().html($('#mdivx').html());
    });
    $('#start').click(function(){
        $('#mymarquee').show();
        $('#mdivx1').hide().html();
    });
});

工作演示 http://jsfiddle.net/cse_tushar/VXm5W/

于 2013-05-02T11:30:25.717 回答
0 
<marquee behavior="scroll" direction="left" id="mymarquee">
<p>Go on... press the button!</p>
</marquee>
<input type="button" value="Stop Marquee" onClick="document.getElementById('mymarquee').stop();">
<input type="button" value="Start Marquee" onClick="document.getElementById('mymarquee').start();">
于 2013-10-02T10:15:22.530 回答