jqueryを使用したボタンによるマーキー動作の制御

jQueryを使用してマーキー動作をボタンで制御できるようにしたいと考えています。jqueryを使用したボタンによるマーキー動作の制御

例えば、私は、次のボタンを作成したとき、私はそれらのそれぞれをクリックしてください：

1) Start (class=btnStart) => the marquee starts 
2) Stop (class=btnStop) => the marquee stops 
3) Back (class=btnBack) => the marquee move backward 
4) Right (class=btnRight) => the marquee moves to right 
5) Fast (class=btnFast) => the marquee moves faster 
6) Slow (class=btnSlow) => the marquee moves slower 

<body> 
    <div> 
     <marquee>Lots of contents here, scrolling right to left by default</marquee> 
    </div> 
    <div> 
    <button class="btnStart">Start</button> 
    <button class="btnStop">Stop</button>\ 
    </div> 
<script> 
    $(function(){ 

     $(".btnStop").click(function(){ 
      $("marquee").stop();// it does not work 
     }); 

     $(".btnFast").click(function(){ 
      $("marquee").attr("scrollamount","5"); // doesnt change speed 
     }); 
    }); 
</script> 
</body>

出典

2017-10-10 Ngun Za Meme

あなたが試したものをご提示ください。 –

これまでに試したことを追加しました。正直言って、私は何をやっているのか分からない。 –

.start()と.stop()方法はjavascriptオブジェクトでのみ動作します。

$('marquee')は、jqueryオブジェクトを返しますが、インデックスを使用してDOM要素を取得できます。

$('marquee')[0]は、選択したHTML要素を返します。

$('marquee')[0].start()またはdocument.getElementById('marquee').start()を使用できます。

let marquee=document.getElementById('marquee'); 
 
$('#btnRight').click(function(){ 
 
    marquee.setAttribute('direction','right'); 
 
    marquee.start(); 
 
}); 
 
$('#btnLeft').click(function(){ 
 
    marquee.setAttribute('direction','left'); 
 
    marquee.start(); 
 
}); 
 
$('#btnStop').click(function(){ 
 
    marquee.stop(); 
 
}); 
 
$('#btnStart').click(function(){ 
 
    marquee.start(); 
 
}); 
 
$('#btnFast').click(function(){ 
 
    marquee.setAttribute('scrollamount',30); 
 
    marquee.start(); 
 
}); 
 
$('#btnSlow').click(function(){ 
 
    marquee.setAttribute('scrollamount',2); 
 
    marquee.start(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<marquee id="marquee" behavior="scroll" scrollamount="10">Hello</marquee> 
 
<button id="btnRight">Right</button> 
 
<button id="btnLeft">Left</button> 
 
<button id="btnStart">Start</button> 
 
<button id="btnStop">Stop</button> 
 
<button id="btnFast">Fast</button> 
 
<button id="btnSlow">Slow</button>

出典

2017-10-10 20:20:43

jqueryを使用したボタンによるマーキー動作の制御

答えて

関連する問題