www.webdeveloper.com
Results 1 to 2 of 2

Thread: mouse over

Hybrid View

  1. #1
    Join Date
    Oct 2009
    Posts
    2

    Exclamation mouse over

    hi all

    i have a problem. i want to use mouse over function - the image change into another image, but... i need it to be like this: when mouse is over the image i want this very image and one more image in a different place of the page to change.
    i tried to use this and chang it but i failed:

    =============================================
    part 1
    ===============================================
    <script language="javascript">
    <!--
    a1=new Image(59,47)
    a1.src="http://yourimage.gif"
    a2=new Image(59,47)
    a2.src="http://yourimage.gif"
    //-->
    </script>
    <script>
    <!--
    function filter(imagename,objectsrc){
    if (document.images)
    document.images[imagename].src=eval(objectsrc+".src")
    }
    //-->
    </script>
    ======================================================
    part 2, put this where you want your button to show
    =======================================================
    <!-- -->
    <a href="yoururl.htm"
    onmouseover="filter('img1','a2'); window.status='Status Message';return true;"
    onmouseout="filter('img1','a1'); window.status='';return true;" onclick="window.focus()">
    <img src="yourimage.gif" name="img1" border=0 width=59 height=47></a>
    <!-- -->

    thanks a lot for help

  2. #2
    Join Date
    Oct 2006
    Posts
    939
    It would be better to abandon that code and use only ONE image.
    The one image you use is actually two that you have combined side by side in PAINT.
    Set your button or div with that image as background. Set style of height, width, overflow:hidden
    onmouseover/onmouseout, call function to change the background position such like
    bgp(this,x,y,more,arguments)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles