OnMouseover Slideshow

Discussion in 'JavaScript' started by JavaScriptBank, Feb 6, 2010.

  1. JavaScriptBank New Member

    Script creates JavaScript menu with links based on rollover effect. While moving detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use JavaScript code below to setup the script
    JavaScript
    Code:
    <script>
    
    function changeimage(towhat,url){
    if (document.images){
    document.images.targetimage.src=towhat.src
    gotolink=url
    }
    }
    function warp(){
    window.location=gotolink
    }
    
    </script>
    <script language="JavaScript1.1">
    var myimages=new Array()
    var gotolink="#"
    
    function preloadimages(){
    for (i=0;i<preloadimages.arguments.length;i++){
    myimages[i]=new Image()
    myimages[i].src=preloadimages.arguments[i]
    }
    }
    
    
    preloadimages("logojs.gif","photo1.jpg","photo2.jpg","photo3.jpg","photo4.jpg")
    </script>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    
    Step 2: Place HTML below in your BODY section
    HTML
    Code:
    <a href="" onMouseover="changeimage(myimages[0],this.href)">JavaScriptBank.com</a><br>
    <a href="" onMouseover="changeimage(myimages[1],this.href)">JavaScriptBank.com</a><br>
    <a href="" onMouseover="changeimage(myimages[2],this.href)">JavaScriptBank.com</a><br>
    <a href="" onMouseover="changeimage(myimages[3],this.href)">JavaScriptBank.com</a><br>
    <a href="" onMouseover="changeimage(myimages[4],this.href)">JavaScriptBank.com</a><br>
    <a href="javascript:warp()"><img src="logojs.gif" name="targetimage" border=0></a>
    	<!--
        	This script downloaded from www.JavaScriptBank.com
        	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    	-->
    





Share This Page