jQuery Event Methods :-

jQuery Mouse Events Methods :- दोस्तों इससे पहले के Tutorial में आप पढ़ चुके हैं कि Events Methods क्या होता है ? आज के Tutorial में आप jQuery Mouse Events Methods के बारे में पढ़ने वाले हैं | इस श्रेणी में वह Events आते हैं जो Mouse के गतिविधि पर निर्भर हैं |

 

Example Of Mouse Event method :- click() method, dblclick method , mouseenter method , mouseleave method

 

Click Events Method :- clicks Method तब execute होता है जब user किसी HTML element पर clicks करता है |

Example Jquery Code For clicks Events Method :-

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p").click(function(){
        $(this).hide();
    });
});
</script>
</head>
<body>
<h3>If you click on Following Text, it will disappear.</h3>
<p>Click me Hide!</p>
<p>Click me disappear!</p>
</body>
</html>

 

 

dblclick Events Method :- तब execute होता है जब user किसी HTML element पर double-clicks करता है |

Example Jquery Code For double-clicks Events Method :-

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p").dblclick(function(){
        $(this).hide();
    });
});
</script>
</head>
<body>
<h3>If you double-clicks on Following Text, it will disappear.</h3>
<p>Double-clicks me Hide!</p>
<p>Double-clicks me disappear!</p>
</body>
</html>

Mouseenter Events Method :- तब execute होता है जब user किसी HTML element के ऊपर mouse के pointer या Arrow को ले जाता है |

Example Jquery Code For Mouseenter Events Method :-

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p").mouseenter(function(){
        $(this).hide();
    });
});
</script>
</head>
<body>
<h3>If you Hover The Mouse Arrow on Following Text, it will disappear.</h3>
<p>Double-clicks me Hide!</p>
<p>Double-clicks me disappear!</p>
</body>
</html>

mouseleave Events Method :- तब execute होता है जब user किसी HTML element के ऊपर mouse के pointer या Arrow को ले जाने के बाद हटाता है |

mouseleave Events Method Example:-

<!DOCTYPE html>
<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
    $("p").mouseleave(function(){
        $(this).hide();
    });
});
</script>
</head>
<body>
<h3>If your  Mouse Arrow leaves from Following Text, it will disappear.</h3>
<p>Double-clicks me Hide!</p>
<p>Double-clicks me disappear!</p>
</body>
</html>

 

दोस्तों आज के Tutorial में आपने jQuery Mouse Events Methods के बारे में पढ़ा है के और दूसरे जितने भी Events Methods हैं इनके बारे में आने वाले Tutorial में तब पढ़ेंगे जब इनकी आवश्यकता हमें आएगी | अभी अगर आप इनका अभ्यास करना चाहते हैं तो आप ऊपर दिए गए उदाहरण में Keyboard Events Methods का उपयोग करके देख सकते हैं इनका उपयोग करना बहुत ही आसान है |

 

 

Next :- jQuery Fading Effects