Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: AnyLink image change onmouseover

  1. #1
    Join Date
    Aug 2008
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default AnyLink image change onmouseover

    1) Script Title: AnyLink Drop Down Menu

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...pmenuindex.htm

    3) Describe problem: Please see my temp page at http://feminineliving.com/temp_new/index.html. The drop down is under "Classes" at the top.

    How do I get the menu images to change onmouseoever, just like the the non drop down menu images?

    Thank you for your help,

    Todd

  2. #2
    Join Date
    Aug 2008
    Location
    Smiths, AL
    Posts
    164
    Thanks
    30
    Thanked 5 Times in 5 Posts

    Default

    on all your other links you have

    onmouseover="document.mmbout.src='images/menu/mainmenu_boutique_mo.png'"

    Where as on the one with the drop down you have
    onMouseover="dropdownmenu(this, event, menu3, '')"

    you need to put the two together. (maybe someone can correct me on it)
    not sure about this but it would be something close to this
    onMouseover="dropdownmenu(this, event, menu3, '')", "document.mmblog.src='images/menu/mainmenu_blog_mo.png'"

  3. #3
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Close dirt_Diver. To define multiple actions within an event handler, you'd separate them using a semicolon. So something like:

    Code:
    <td width="83"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, ''); document.images.myimage.src='over.gif'" onMouseout="delayhidemenu(); document.images.myimage.src='out.gif'"><img name="myimage" src="images/menu/mainmenu_classes.png" width="83" border="0"/></a></td>
    DD Admin

  4. #4
    Join Date
    Aug 2008
    Location
    Smiths, AL
    Posts
    164
    Thanks
    30
    Thanked 5 Times in 5 Posts

    Default

    Quote Originally Posted by ddadmin View Post
    Close dirt_Diver. To define multiple actions within an event handler, you'd separate them using a semicolon. So something like:

    Code:
    <td width="83"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, ''); document.images.myimage.src='over.gif'" onMouseout="delayhidemenu(); document.images.myimage.src='out.gif'"><img name="myimage" src="images/menu/mainmenu_classes.png" width="83" border="0"/></a></td>
    ahhh yes, now I remember thanks.

  5. #5
    Join Date
    Aug 2008
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you DDAdmin and Dirt Diver,

    I made the change DD suggested, you can see it here:
    http://feminineliving.com/temp_new/index.html.

    I wasn't sure this was going to work, because the onmouseout images for the drop down menu (listed as menu 3 in my code) are defined in the beginning of the script and not in the HTML body. So I would think that the onmouseover images would need to be defined in the script section as well.

    When you view the source for the above link, you can see that I made the changes in the body, but the menu choices in the drop down (Class 1, Class 2, Class 3, and Class 4) are still not changing to their corresponding highlighted images.

    Thanks again,

    Todd
    Last edited by toddsilva; 08-14-2008 at 04:34 PM. Reason: to clarify my question

  6. #6
    Join Date
    Aug 2008
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi DDAdmin,

    I was still not able to get the image change onmouseover to work on the drop down after applying the change you suggested. I posted this earlier, but don't think I was very clear in my post.

    The change you suggested was to the code in the HTML body. But the images for the drop down are specified in the script section - so shouldn't the change be made there? I have made several attempts at modifying the script code but to no success.

    Thank you,

    Todd

  7. #7
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Actually, looking at your HTML, the implementation should work. However, I noticed the image path you've specified for the mouse over effect is invalid:

    Code:
    		<td width="83"><a href="#" onClick="return clickreturnvalue()"
    		onMouseover="dropdownmenu(this, event, menu3, ''); document.images.mmclass.src='images/menu/mainmenu_classes_mo.png'" 
    		onMouseout="delayhidemenu(); document.images.mmclass.src='images/menu/mainmenu_classes.png'"><img name="mmclass" 
    		src="images/menu/mainmenu_classes.png" width="83" border="0"/></a></td>
    Trying to call up http://feminineliving.com/temp_new/i...classes_mo.png returns a 404 error.
    DD Admin

  8. #8
    Join Date
    Aug 2008
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    It returns a 404 because the main drop down button, "Classes" is not a menu choice, it's only at the top of the drop down. What I will do today is create that PNG and see if it works.

    Thanks again for all your help DD.

  9. #9
    Join Date
    Aug 2008
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi DD,

    OK, I created the missing image, and now it highlights on mouseover, but the drop downs still don't highlight.

    Is there something I'm doing incorrectly or am I missing something?

  10. #10
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Well, the main menu item "Classes" now turns yellow onmouseover, so that seems to work now. If you're asking how to also get the individual image links within the drop down menu to change images, you'll need to repeat what you did for the "Classes" link, but inside each of menu contents within the script, something like:

    Code:
    //Contents for menu 3
    var menu3=new Array()
    "
    "
    menu3[0]='<a href="http://feminineliving.com/classes/class_1.html" onMouseover=\"document.images.uniquevar1.src='images/menu/over.png'\" onMouseout=\"document.images.uniquevar1.src='images/menu/out.png'\"><img name="uniquevar1" src="images/menu/mainmenu_class 1.png" alt="" width="83" height="46" border="0"></a>'
    DD Admin

Bookmarks

Posting Permissions

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