Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Aug 2008
    Posts
    29
    Thanks
    4
    Thanked 1 Time in 1 Post

    logo color change on link hover

    Hi,

    I have three links on my site project (not live yet) and when you hover over the links I have the text and border change color. Example: when you hover over the home link the border color changes to blue and the text also changes to blue.

    I would like my logo to also change to the same color as the link someone is hovering over.

    Could anyone help out with this? I would be very greatful.

    Thanks
    Last edited by j634; 02-08-2012 at 01:34 PM.

  • #2
    Regular Coder
    Join Date
    Feb 2012
    Location
    Nebraska, USA
    Posts
    132
    Thanks
    8
    Thanked 19 Times in 19 Posts
    This is completely possible, however if your Logo is an image you're going to have to make a second copy of your Logo and make it blue as well. Then when you hover over it, it will swap out your current Logo for the blue version.

    The following will take the first image called "logo" and replace it with an image named "logoblue" when you hover over it.

    Code:
     <a href="#" onmouseout="MM_swapImgRestore()" onmouseover ="MM_swapImage('logo','','images/logoblue.jpg',1)">
              <img src="images/logo.jpg" alt="work" name="logo" width="109" height="31" border="0" id="logo">
    </a>

  • Users who have thanked dylanbaumannn for this post:

    j634 (02-08-2012)

  • #3
    New Coder
    Join Date
    Aug 2008
    Posts
    29
    Thanks
    4
    Thanked 1 Time in 1 Post
    Thanks for the reply and the code, however I tried that before and it never worked properly. The image shows up before any hovering on a link. So basically I have 2 logos in the header.

    I did manage to get it to work (sortof) and when I hovered over my link the logo image appeared, but I am still having trouble getting it in the correct position. I think my solution will work with a little more time and code effort.

    I will put this as resolved and keep plugging away.

    Thanks again

  • #4
    Regular Coder
    Join Date
    Feb 2012
    Location
    Nebraska, USA
    Posts
    132
    Thanks
    8
    Thanked 19 Times in 19 Posts
    absolutely not a problem!

    If you find that it's still giving you troubles please feel free to post the code where your logo is at and we'll be more than happy to help out


  •  

    Posting Permissions

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