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를 사용하는 버튼으로 마키 동작 제어

답변

관련 문제