Results 1 to 5 of 5

Thread: Need to change Css from li:hover to a:hover

  1. #1
    Join Date
    Dec 2005
    Posts
    107
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Need to change Css from li:hover to a:hover

    The script written in CSS has a hover feature in it. But the hover is written li:hover which doesn't work in IE 6. We have researched and what we found said to write it as a:hover. Can anyone help? Here is the hover part:

    #nav-menu li a:hover#a0 {background: url(Lanitech_Artwork/button_home_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a1 {background: url(Lanitech_Artwork/button_about_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a2 {background: url(Lanitech_Artwork/button_subscribe_on_back.gif); background-repeat: no-repeat;}
    #nav-menu li a:hover#a3 {background: url(Lanitech_Artwork/button_current_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a4 {background: url(Lanitech_Artwork/button_contribute_on_back.gif); background-repeat: no-repeat;}
    #nav-menu li a:hover#a5 {background: url(Lanitech_Artwork/button_advertise_on_back.gif); background-repeat: no-repeat;}
    #nav-menu li a:hover#a6 {background: url(Lanitech_Artwork/button_partners_on_back.gif); background-repeat: no-repeat;}
    #nav-menu li a:hover#a7 {background: url(Lanitech_Artwork/button_contact2_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a8 {background: url(Lanitech_Artwork/menu_yearly_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a9 {background: url(Lanitech_Artwork/menu_single_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a10 {background: url(Lanitech_Artwork/menu_writers_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a11 {background: url(Lanitech_Artwork/menu_photo_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a12 {background: url(Lanitech_Artwork/menu_featured_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a13 {background: url(Lanitech_Artwork/button_advertise_on_back.gif); background-repeat: no-repeat;}
    #nav-menu li a:hover#a14 {background: url(Lanitech_Artwork/menu_materials_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a15 {background: url(Lanitech_Artwork/menu_ads_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a16 {background: url(Lanitech_Artwork/menu_mechanicals_on.jpg); background-repeat: no-repeat;}
    #nav-menu li a:hover#a17 {background: url(Lanitech_Artwork/menu_distribution_on.jpg); background-repeat: no-repeat;}

  2. #2
    Join Date
    Nov 2007
    Location
    USA
    Posts
    170
    Thanks
    8
    Thanked 22 Times in 22 Posts

    Default

    if you are just not getting the image to show I would try to place quotes around the file name...hope that helps.
    What is obvious to you might not be to another.


    My Site

  3. #3
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    #nav-menu li a:hover#a0
    You cannot place the id value after the hover. Your code should look like this:

    Code:
    #nav-menu li a#a0:hover
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  4. #4
    Join Date
    Nov 2007
    Location
    USA
    Posts
    170
    Thanks
    8
    Thanked 22 Times in 22 Posts

    Default

    Oh good catch snookerman I didn't even notice that
    What is obvious to you might not be to another.


    My Site

  5. #5
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Thanks
    I see the OP hasn't answered so I'll be more clear, try this code:

    Code:
    #nav-menu a {background-repeat:no-repeat;}
    #nav-menu #a0:hover {background: url(Lanitech_Artwork/button_home_on.jpg);}
    #nav-menu #a1:hover {background: url(Lanitech_Artwork/button_about_on.jpg);}
    #nav-menu #a2:hover {background: url(Lanitech_Artwork/button_subscribe_on_back.gif);}
    #nav-menu #a3:hover {background: url(Lanitech_Artwork/button_current_on.jpg);}
    #nav-menu #a4:hover {background: url(Lanitech_Artwork/button_contribute_on_back.gif);}
    #nav-menu #a5:hover {background: url(Lanitech_Artwork/button_advertise_on_back.gif);}
    #nav-menu #a6:hover {background: url(Lanitech_Artwork/button_partners_on_back.gif);}
    #nav-menu #a7:hover {background: url(Lanitech_Artwork/button_contact2_on.jpg);}
    #nav-menu #a8:hover {background: url(Lanitech_Artwork/menu_yearly_on.jpg);}
    #nav-menu #a9:hover {background: url(Lanitech_Artwork/menu_single_on.jpg);}
    #nav-menu #a10:hover {background: url(Lanitech_Artwork/menu_writers_on.jpg);}
    #nav-menu #a11:hover {background: url(Lanitech_Artwork/menu_photo_on.jpg);}
    #nav-menu #a12:hover {background: url(Lanitech_Artwork/menu_featured_on.jpg);}
    #nav-menu #a13:hover {background: url(Lanitech_Artwork/button_advertise_on_back.gif);}
    #nav-menu #a14:hover {background: url(Lanitech_Artwork/menu_materials_on.jpg);}
    #nav-menu #a15:hover {background: url(Lanitech_Artwork/menu_ads_on.jpg);}
    #nav-menu #a16:hover {background: url(Lanitech_Artwork/menu_mechanicals_on.jpg);}
    #nav-menu #a17:hover {background: url(Lanitech_Artwork/menu_distribution_on.jpg);}
    As you can see, I simplified it a bit to make it easier to edit and quicker to parse by browsers.
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

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
  •