Highlight table cells with a background Image

Discussion in 'Web Design & Coding' started by S Walch, Apr 27, 2006.

  1. S Walch

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    I'm currently trying to get it so that when someone hovers over a certain table cell, then a background image pops up behind it.

    I'm thinking it's something to do with javascript, but I'm not sure.

    http://saturn.v21hosting.co.uk/main.htm

    For the gren buttons - basically, when someone hovers over them, I want them to turn completely black and just turn the green into black. And the only way to do that would be to have it pop up a background picture, hence my dilema.

    I tried doing it so that when someone hovered over the link them the background image would bump up, but that was a silly idea :p

    http://saturn.v21hosting.co.uk/swalchy.css
     
    S Walch, Apr 27, 2006
    #1
    1. Advertisements

  2. S Walch

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    It can be achieved either with CSS and JS.
     
    James, Apr 27, 2006
    #2
    1. Advertisements

  3. S Walch

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    how? being my question :p

    I must say, I actually didn't say that in my original post lol.

    Edit:

    Actually, nevermind.

    Didn't realise it was a simple td.navi:hover
     
    Last edited: Apr 27, 2006
    S Walch, Apr 27, 2006
    #3
  4. S Walch

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    James, Apr 27, 2006
    #4
  5. S Walch

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    I'd use DIV instead would I?

    But why is it if i do a div, they end up going BELOW each other?

    Case of Positioning huh?
     
    S Walch, Apr 27, 2006
    #5
  6. S Walch

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    Yep, it's all about positioning with CSS. Once you get a solid understanding of it, it actually makes things much easier.
     
    James, Apr 27, 2006
    #6
  7. S Walch

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    postition: relative:
    left: 20px;

    Would work wouldn't it? :)
     
    S Walch, Apr 27, 2006
    #7
  8. S Walch

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    I suggest looking at this [thread=6922]thread[/thread] and my personal website to get some ideas.

    You are on the right track though.
     
    James, Apr 27, 2006
    #8
  9. S Walch

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    Geez, I'm I going to have to give each one it's own div? :(

    Trying to get idea's from the places you've suggested, but I can only seem to find that I'd have to create a seperate Div for each one.

    Table was easier...

    Edit:

    Never mind, got it lol.

    position: relative:
    left: 7px;
    float: left

    and walla - much easier :p
     
    Last edited: Apr 28, 2006
    S Walch, Apr 27, 2006
    #9
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.