jQuery Trigger Mousedown Event Method

jQuery mousedown() event method; Through this tutorial, i am going to show you how to use jQuery mousedown event with HTML elements.

jQuery Trigger Mousedown Event Method

The jQuery mousedown event occurs when the left mouse button is pressed down over the selected element.

In other words, when the mouse button is pressed down, at the time while the mouse is over the HTML element. This trigger mousedown event on html elements.

Syntax jQuery Trigger Mousedown Event Method

$(selector).mousedown()

This triggers the mousedown event for selected elements.

$(selector).mousedown(function)

Parameters of jQuery Trigger Mousedown Event Method

Function :- It is an optional parameter. This executes itself when the mousedown event is triggered.

Example 1 – jQuery Trigger Mousedown Event Method

See the mousedown event method example; as shown below:

 
<!DOCTYPE html>    
<html>    
<head>    
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
<script>    
$(document).ready(function(){    
    $("#first").mousedown(function(){    
       $( "span" ).text( "mouse down event triggered" ).show().fadeOut( 2000 );   
    });    
});    
</script>    
</head>    
<body>    
<h1 id="first">Click Me.!!</h1>   
<span></span>   
</body>    
</html>

Example 2 – jQuery Trigger Mousedown Event Method

See the next mousedown event example; as shown below:

<!DOCTYPE html>
<html>
<head>
<title>jQuery Mouse Down Event</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script> 
$(document).ready(function(){
	$("#second").mousedown(function(){
	    $( this ).text("Mouse Down Triggered");
	  });
	});
</script>
</head>
<body>
<div id="second">Click Here for Preview</div>
</body>
</html>

jQuery Trigger Mousedown Event Method