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
    May 2007
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS-based image rollover for suckerfisk-type navigation menu?

    I posted a request earlier for CSS-based image rollovers and was directed to use the 'z-index' to do it. I understand how that works, but I don't know how I can apply it to my nav bar. I used a simple suckerfish-type horizontal navigation, and all my images are nested in the html for my <li>. All the examples I see that use the z-index only apply them to divs that they can assign the hover command to. A preview of my site is up at http://deepwaterchurch.com/prelive if anyone would care to take a look. I'd appreciate any help I could, and I'd rather not do this with clunky java script if I can help it. Thanks.

  • #2
    Regular Coder
    Join Date
    Oct 2006
    Posts
    206
    Thanks
    1
    Thanked 0 Times in 0 Posts
    What exactly is the problem? I tried that link sans JS, and the menu worked...

  • #3
    New Coder
    Join Date
    May 2007
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm trying to make it so that when I roll over the images (i.e. home) it changes to a different over-state (i.e. underlined, colored, etc). I'd like to do this for the menu and sub menu pics.

  • #4
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    You can see the CSS rollover effect in one of my demos. It doesn’t look like CSS rollovers aren’t appropriate for your case because your images represent content. I would use JavaScript to manipulate the existing img elements.
    For every complex problem, there is an answer that is clear, simple, and wrong.


  •  

    Posting Permissions

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