Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

วิธีปิดการทำงานของแอนิเมชันทั่วไป (Globally) ด้วย jQuery


เพื่อปิดการทำงานของแอนิเมชันทั่วไป (globally) โดยใช้ jQuery ให้ใช้เมธอด jQuery.fx.off

เพื่อเปิดใช้งานแอนิเมชัน:

$("#enable").click(function(){ 
    jQuery.fx.off = false; 
});

เพื่อปิดการทำงานของแอนิเมชัน ให้ตั้งค่า jQuery.fx.off เป็น true:

$("#disable").click(function(){ 
    jQuery.fx.off = true; 
});

คุณสามารถลองรันโค้ดตัวอย่างต่อไปนี้เพื่อปิดการทำงานของแอนิเมชันทั่วไปด้วย jQuery:

ตัวอย่าง

<html> <head> <title>The jQuery Example</title> 
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script language = "javascript"> 
        $(document).ready(function() { 
            $("#enable").click(function(){ 
                jQuery.fx.off = false; 
            }); 
            $("#disable").click(function(){ 
                jQuery.fx.off = true; 
            }); 
            $("#go").click(function(){ 
                $(".target").animate({left: '+=200px'}, 2000); 
            }); 
            $("#back").click(function(){ 
                $(".target").animate({left: '-=200px'}, 200); 
            }); 
        }); 
    </script> 
    <style> 
    p {background-color:#bca; width:350px; border:1px solid green;} 
    div{position: absolute; left: 50px; top:300px;} 
    </style> 
</head> 
<body> 
<p>Click enable or disable and then go or back button:</p> 
<button id = "enable"> Enable</button> 
<button id = "disable"> Disable </button> 
<button id = "go"> GO</button> 
<button id = "back"> BACK </button> 
<div class = "target"> 
    <img src = "./images/jquery.jpg" alt = "jQuery" /> 
</div> 
</body> 
</html>