Skip to main content

Mouse Click Event

Many of the user's interactions with your pages will take the form of mouse actions. JavaScript provides a robust set of handlers for these events, eg: the onmousedown event. In the example shown, highlight some code that traps the MOUSE OVER and MOUSE UP event.

 
<script language="JavaScript">
<!--
// PRELOADING IMAGES
if (document.images) {
 img_on =new Image();  img_on.src ="1.gif"; 
 img_off=new Image();  img_off.src="2.gif"; 
 img1_on =new Image(); img1_on.src ="111.gif"; 
 img1_off=new Image(); img1_off.src="112.gif"; 
 img2_on =new Image(); img2_on.src ="121.gif"; 
 img2_off=new Image(); img2_off.src="122.gif"; 
 img3_on =new Image(); img3_on.src ="131.gif"; 
 img3_off=new Image(); img3_off.src=".132.gif"; 
 img4_on =new Image(); img4_on.src ="141.gif"; 
 img4_off=new Image(); img4_off.src=".142.gif"; 
 img5_on =new Image(); img5_on.src ="151.gif"; 
 img5_off=new Image(); img5_off.src="152.gif"; 
 img6_on =new Image(); img6_on.src ="161.gif"; 
 img6_off=new Image(); img6_off.src="162.gif"; 
}
function <b>movr</b>(k) {
 if (document.images) 
  eval('document.img'+k+'.src=img'+k+'_on.src');
}
function <b>mup</b>(k) {
 if (document.images) 
  eval('document.img'+k+'.src=img'+k+'_off.src');
}
function handlePress() {
 if (document.images) 
  document.imgName.src=img_on.src;
}
function handleRelease() {
 if (document.images) 
  document.imgName.src=img_off.src;
}
//-->
</script>
 

Next: Calling Routine