User Id :    Password :      New Member   Forgot Password  
 
Animation Using JavaScript
Description it is possible to use JavaScript to create animated images. The trick is to let a JavaScript change between different images on different events.   No. of Views     1477
  Rating     0
Author Najmul Hoda   Posted On     22 Jan 2010
Tags Java Script    

Sample Code   Download Code

Introduction

Before explaining the article, I would like to thank all readers who read myarticle and voted for it. Your appreciation for my article gives me strength towrite more good articles. Hope in future I will get your valuable comments andsuggestions. Now I won't waste your time and come back to the topic. I havewritten this article on ‘JavaScriptAnimation’. In this article, it is possible to use JavaScript to createanimated images. The trick is to let a JavaScript change between differentimages on different events.

In the following example we will add an image that should act as a linkbutton on a web page. We will then add an onMouseOver event and an onMouseOutevent that will run two JavaScript functions that will change between theimages.

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>ValidationPage</title>

   <script type="text/javascript">

functionmouseOver()

{

document.getElementById("b1").src ="Bluehills.jpg";

}

function mouseOut()

{

document.getElementById("b1").src ="Sunset.jpg";

}

</script>

 

</head>

<body>

    <form id="form1" runat="server" onsubmit="return validate_form(this);" method="post">

    <div>

   <a href="http://www.dotnetlogix.com" target="_blank">

<img border="0" alt="Visit DotNetLogic!" src="Bluehills.jpg"id="b1"width="26"height="26"onmouseover="mouseOver()"onmouseout="mouseOut()"/></a>

 

 

    </div>

    </form>

</body>

</html>

 

About Author

About Author He is a team lead, having 8+ years of experience. He loves writing technical article for .Net developers. Najmul Hoda
No Photo
 
Country United States
Company BirlaSoft
Home Page http://www.magixchat.com

Rate this article

Rating options from poor, fair, good, very good to excelent.  
 

Comments

   
Write your comment here.
Comment
Verification Code