A:HOVER in IE7

Discussion in 'HTML & Website Design' started by guyaloni, Nov 30, 2007.

  1. #1
    I am used to use a and a:hover tags with different images in order to achieve a rollover effect.

    A very simple example, no external css:
    http://www.nacencia.com/ie7/

    In mozilla and IE6 it works great. In IE7 - it doesn't! Each time I move the mouse over the image it looks like it reloads again, and therefore it blinks.

    I found a solution in the level of the user, modifying the history option on the browser:
    [​IMG]

    of-course this solution is not good, since it depends on the user.

    Another option I found is to make one image with both normal and hover parts, and simply play with its position. You can see it here:
    http://www.nacencia.com/ie7/solution.htm

    but if there is another option I prefer not to get into this one.

    Thanks!!!
     
    guyaloni, Nov 30, 2007 IP
  2. N_F_S

    N_F_S Active Member

    Messages:
    2,475
    Likes Received:
    56
    Best Answers:
    0
    Trophy Points:
    90
    #2
    I was really struggling to get an image animating after a user sumbits a form, thats hard to do on IE7 as well.

    IE7 have some differences comparing to IE6.
     
    N_F_S, Nov 30, 2007 IP
  3. joebert

    joebert Well-Known Member

    Messages:
    2,150
    Likes Received:
    88
    Best Answers:
    0
    Trophy Points:
    145
    #3
    "CSS Sprites" as they're called are the best way to go.
    Not only do they solve your immediate issue, they also result in less requests going to the HTTP server at any given time. It may seem like a tiny amount of requests, but those requests add up as the site gets larger.

    They're definately worth getting into.
     
    joebert, Nov 30, 2007 IP
  4. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    436
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Dan Schulz, Nov 30, 2007 IP