1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

Making image maintain focus

Discussion in 'Web Design & Development' started by sambojambo, Jul 12, 2006.

Thread Status:
Not open for further replies.
Advertisement
  1. sambojambo

    sambojambo Thread Starter

    Joined:
    Nov 14, 2003
    Messages:
    29
    Hi,
    I have created a website and have used Fireworks to create the menu so that the images I used in the menu can have swap image effects. Site is -

    http://www.samoa.ws/rlsm/home.cfm

    I want the image to maintain its "couloured" version when I click on that page, not just when I roll over the image. Is there a way that I can make the image keep its "coloured" version rather than rolling back to its "black and white" state when that page is showing?

    Hope its making sense......

    Thanks in advance
     
  2. DrP

    DrP

    Joined:
    Jul 23, 2005
    Messages:
    739
    Do you mean something like this?
    #navcontainer a {padding: 5px 0px 5px 0px; margin: 10px 0px 0px 0px; display: block; width: 150px; border: 1px solid #1d551d;}
    #navcontainer a:link, #navcontainer a:visited {background-color: #ffffff;
    color: #1d551d; text-decoration: none;}
    #navcontainer a:hover {background-color: #009999; color: #ffffff; text-decoration: none;}
    #navcontainer a#current {background-color: #e6ffbf; color: #1d551d; text-decoration: none;}

    Then in the link for the page you are on put id="current"
    I think you can also use a:active to style a link currently loading.
     
  3. knight_47

    knight_47

    Joined:
    Mar 14, 2006
    Messages:
    941
    Is it me, or is it the website.. None of the images are turning to color when I put my mouse over them. Are you working on it or something? The only way I know of doing what you want, is modifying the HTML on each page. Use the rollover effects for all of them, them when it's clicked on, and your taken to the page, remove the rollover effect on the page are taken too, and use the colored image. I'm probably not making any sense am I?
     
  4. DrP

    DrP

    Joined:
    Jul 23, 2005
    Messages:
    739
    You have your rollovers being controlled by Javascript. If someone has it turned off they won't see the rollovers, though I'm not sure how many peole turn it off.
    The proper way to do it would be using the stylesheet, which so far contains Sweet FA.
    You'd have to give each link an id tag then set the images for each id in the stylesheet to show different images depending on the state of the link.

    Knight: The images do work but are slow to load and you have to leave your mouse over them for a while.
     
  5. sambojambo

    sambojambo Thread Starter

    Joined:
    Nov 14, 2003
    Messages:
    29
    Thanks guys,
    Sorry about the speed, but being in Samoa, our speeds arent the greatest. I know my css contains sweet FA, as I know sweet FA about style sheets. Would any one know a site that I can learn how to do these changes by using the stylesheet and learn how to use style sheets to their fullest. Much appreciated.
     
  6. knight_47

    knight_47

    Joined:
    Mar 14, 2006
    Messages:
    941
    Yea your right.
     
  7. DrP

    DrP

    Joined:
    Jul 23, 2005
    Messages:
    739
  8. sambojambo

    sambojambo Thread Starter

    Joined:
    Nov 14, 2003
    Messages:
    29
    Thanks for that. Will have a go and see how it turns out.
    Cheers
     
  9. Sponsor

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Loading...
Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/482651

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice