Creating Dynamic Buttons

[yogeshwartyagi]

JavaScript button dynamic effects are created using images. The JavaScript button requires three images for the different stages. So to use this example create three images img1.jpg, img2.jpg and img3.jpg (each having different look of button). Copy the code below and save into a file with .htm extension. Now open the file in your browser. Moving mouse over the button will change the image and pressing mouse button will change it again.

 

Make three images representing different states of button img1.jpg img2.jpg and img3.jpg then store the code into a file with .htm extension, open the file in your browser.

 

<a href="http://www.digitalmoneytalk.com/"

onMouseOver="return changeImg()"

onMouseOut= "return changeImgBack()"

onMouseDown="return handleMDown()"

onMouseUp="return handleMUp()"

><img

name="btn" src="img1.jpg" width="110" height="28" border="0"

alt="javascript button"></a>

 

<script language="JavaScript">

 

 

function changeImg()

{

document.images["btn"].src= "img1.jpg";

return true;

}

function changeImgBack()

{

document.images["btn"].src = "img3.jpg";

return true;

}

function handleMDown()

{

document.images["btn"].src = "img2.jpg";

return true;

}

function handleMUp()

{

changeImg();

return true;

}

</script>