Jquery의 stop() 사용 예에 ​​대한 자세한 설명

stop은 jQuery에서 페이지 애니메이션 효과를 제어하는 ​​데 사용되는 방법입니다. 실행 후 즉시 현재 페이지의 애니메이션 효과를 종료합니다.
stop은 새 버전의 jQuery에 2개의 매개변수를 추가했습니다.
첫 번째 매개변수는 애니메이션 시퀀스를 지울지 여부, 즉 현재 요소의 애니메이션 효과를 중지할지 또는 여기에 연결된 모든 애니메이션 효과를 중지할지 여부를 의미합니다. false이고 건너뛰었습니다. 현재 애니메이션 효과, 다음 애니메이션 효과 실행
두 번째 매개변수는 현재 애니메이션 효과를 끝까지 실행할지 여부입니다. 이는 현재 애니메이션을 중지할 때 애니메이션 효과가 방금 실행되었음을 의미합니다. 이때 원하는 효과가 애니메이션 실행 후인 경우 이 매개변수는 true입니다. 그렇지 않으면 중지를 실행할 때 애니메이션 효과가 중지됩니다

HTML code

<p id="animater">
            stop()方法测试
        </p>

        <p id="button">
            <input type="button" id="button1" value="stop()"/>
            <input type="button" id="button2" value="stop(true)"/>
            <input type="button" id="button3" value="stop(false,true)"/>
            <input type="button" id="button4" value="stop(true,true)"/>
            
        </p>

CSS code

#animater{
                width: 150px;
                background:activeborder;
                border: 1px solid black;
                /*为了移动，需设置此属性*/
                position: relative;
            }

jquery code

//            为了看效果，随意写的动画
                $('#animater').animate({
                    'right':-800
                }, 3000).animate({'font-size':'16px'},'normal').animate({'font-size':'26px'},'normal').animate({'font-size':'36px'},'normal').animate({'font-size':'46px'},'normal').animate({'font-size':'56px'},'normal').animate({'opacity':0},'normal').animate({'opacity':1},'normal').animate({'left':200,'font-size':'16px'},'normal');



        
                //           点击不同的button执行不同的操作
        
                $('#button1').click(function(){
                    //默认参数是false，不管写一个false还是两个false还是没写false效果一样
                    $('#animater').stop();
                });
                $('#button2').click(function(){
                    //第二个参数默认false
                    $('#animater').stop(true);
                });
                $('#button3').click(function(){
                    $('#animater').stop(false,true);
                });
                $('#button4').click(function(){
                    $('#animater').stop(true,true);
                });

위 내용은 Jquery의 stop() 사용 예에 ​​대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!