A Wired.com user account lets you create, edit and comment on Webmonkey articles. You will also be able to contribute to the Wired How-To Wiki and comment on news stories at Wired.com.
It's fast and free.
processing...Retrieve Sign In
Please enter your e-mail address or username below. Your username and password will be sent to the e-mail address you provided us.
processing...Welcome to Webmonkey
- edit articles
- add to the code library
- design and write a tutorial
- comment on any Webmonkey article
Sign In Information Sent
JavaScript Event - Dblclick
/skill level/
/viewed/
This code was written based on a template by John Resig. The original can be found at John Resig's addEvent function website.
The code, and the template, are referred to in Webmonkey's JavaScript Events reference page. In this example, the onDblClick event fires whenever a mouse button is clicked twice within a time frame determine by the operating system (a double-click). If attached to a specific object (such as the div in the example below), the event only fires if the mouse is double-clicked within the bounds of that object.
This code is in a wiki. If you have any advances to make to the original tutorial and code, please feel free to contribute.
The Code
<html>
<head>
<script>
// addEvent function by John Resig:
// http://ejohn.org/projects/flexible-javascript-events/
function addEvent( obj, type, fn ) {
if ( obj.attachEvent ) {
obj['e'+type+fn] = fn;
obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
obj.attachEvent( 'on'+type, obj[type+fn] );
} else
obj.addEventListener( type, fn, false );
}
</script>
</head>
<body>
<!-- HTML for example event goes here -->
<div id="mydiv" style="border: 1px solid black; width: 100px; height: 100px; margin-top: 10px;"></div>
<script>
// Script for example event goes here
addEvent(document.getElementById('mydiv'), 'dblclick', function(event) {
display_short('double-clicked');
});
function display_short(str)
{
clearTimeout();
document.getElementById('mydiv').innerHTML = str;
if (str != '')
setTimeout("display_short('')", 1000);
}
</script>
</body>
</html>
What it Looks Like
- This page was last modified 00:54, 23 September 2008.
Special Offer For Webmonkey Users
WIRED magazine:
The first word on how technology is changing our world.
