Grow your CSS skills. Land your dream job.

Reset CSS to Get Around Browser Caching

  • # April 22, 2010 at 11:00 am

    I have some jQuery that changes the opacity of a DIV on a hover event (opacity is 0 on load, then changes to 1 on hover), and it all works well. However, in Safari for Mac, when I then click that element to go to a different page, then use the back button to come back, the opacity of that DIV is still 1 even though the mouse isn’t hovering over that DIV. If I then hover over a second instance of that kind of DIV, I have two of these DIVs with an opacity of 1 when there should be only one. I fix this condition by hovering over the first DIV, then moving the mouse out.

    If I navigate to the second page, then return to the first page by clicking a link instead of using the back button, it all works correctly (the first page loads with all of that type of DIV have an opacity of 0).

    I haven’t seen this behavior in FireFox yet.

    It seems like this would be a common problem, but no search queries I try here or on Google has shown a similar problem.

    Any solutions anyone knows of? I’m thinking there should be a jQuery/Javascript to reset the CSS styles on page load, but I’m not sure if that would work if the page loads in Safari as a result of clicking the back button.

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".