In lab 9, we had to create 3 rollover using html, fireworks, and JavaScript. For the html rollover, I used the code,<p><a href="#" onmouseout= "MM_swapImgRestore()" onmouseover="MM_swapImage ('pandaswag','','html2.jpg',1)"><img src="html1.jpg" name="pandaswag" width="291" height="152" border="0" id="pandaswag" /></a></p>. Basically, the code is saying for the image "html2.jpg" to show up first and when someone moves their mouse arrow on the image, it change to the second image, "html2.jpg."
For the fireworks rollover, I used the code, <a href="javascript:;"onmouseout="MM_
swapImgRestore(); "onmouseover="MM_swapImage('FWRollover','','FWRollover_
s2.jpg',1);"><img name="FWRollover" src="FWRollover.jpg" width="200" height="200" id="FWRollover" alt="" /></a>. The code is similar to the html however, the rollover can create using the software, fireworks and later, it converted to a html code that I later added to my lab.
swapImgRestore(); "onmouseover="MM_swapImage('FWRollover','','FWRollover_
s2.jpg',1);"><img name="FWRollover" src="FWRollover.jpg" width="200" height="200" id="FWRollover" alt="" /></a>. The code is similar to the html however, the rollover can create using the software, fireworks and later, it converted to a html code that I later added to my lab.
For the JavaScript rollover, I used the code :
In my html document, I created a table with the width of 700, height of 500, and border of 5. When someone visit my website, the table will has the image, "panda6.jpg" however, the person can move their mouse arrow on the images below it to see them bigger on top. I can use this skill in the future to create rollovers not only in html or fireworks but also in, JavaScript. I like the JavaScript rollover because it looks really nice and make the user go along the pictures and they can view them easily.
No comments:
Post a Comment