jQuery click() and dblclick() example
jQuery click() and dblclick() events are the most common used mouse events :
- click() – Fire when mouse single click on the matched element.
- dblclick() – Fire when mouse double clicks on the matched element.
Try it yourself
<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<style type="text/css">
#singleClick, #doubleClick{
float:left;
padding:8px;
margin:16px;
border:1px solid blue;
width:150px;
height:150px;
background-color:#999966;
}
</style>
</head>
<body>
<h1>jQuery click() and dblclick() example</h1>
<div id="singleClick">
Single Click Me
</div>
<div id="doubleClick">
Double Clicks Me
</div>
<script type="text/javascript">
$('#singleClick').click(function(){
$('#singleClick').slideUp();
});
$('#doubleClick').dblclick(function(){
$('#doubleClick').fadeOut();
});
</script>
</body>
</html>
About Author
Founder of Mkyong.com, love Java and open source stuff. Follow him on Twitter. If you like my tutorials, consider make a donation to these charities.
how to implement both in single div