Let's say I have a navigation item with a background image at the top, and a solid background color which covers the rest of the navigation item.
I want to make a rollover image for it, also. So I have the solid rollover color and the rollover image at the top.
Everything would be fine if it weren't for IE. I don't know how to prevent the flicker, because Pixy's (sp?) trick doesn't work anymore. (the trick is one background image with both images, and you change it with background positioning)
(I don't have a demo because I haven't actually started this, I'm just thinking of it.)
Any way to get around this?I don't fully understand your problem. (a demo would help) but maybe it's something to do with prelading the rollover image.
A simple css way to preload an image is to set the image somewhere (bottom?) in your page.
i.e html
<body>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"blah/yhello.gif" alt="Random" width="1" height="1" style="display:none;" />
</body>
hope that helps.
Best Wishes,
DavidOriginally posted by davidbrent
I don't fully understand your problem. (a demo would help) but maybe it's something to do with prelading the rollover image.
A simple css way to preload an image is to set the image somewhere (bottom?) in your page.
i.e html
<body>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"blah/yhello.gif" alt="Random" width="1" height="1" style="display:none;" />
</body>
hope that helps.
Best Wishes,
David
Hmm... I still don't think that would help the IE flicker because it flickers whenever the background image URL is changed.
My problem is this:
______________________
| background img here |
| |
| |
|_____________________|
I want a background image where it says "background here," and a solid color for the rest of the background.
for the hover state, I want the background img to change to another one, and I want the solid color to change also.couldn't you merge the top image and the solid colour to make a bigger imge that fits the whole nav block then just rollover with lists.
preloading the "to be rollovered" image will prevent the image being Download ed only on hover on link and Download ed as soon as the whole page is loaded and cached.Originally posted by davidbrent
couldn't you merge the top image and the solid colour to make a bigger imge that fits the whole nav block then just rollover with lists.
Yeah, I guess. I have to make it fairly big, though, because I need to cover big text sizes. I was just hoping there was another solution.
Originally posted by davidbrent preloading the "to be rollovered" image will prevent the image being Download ed only on hover on link and Download ed as soon as the whole page is loaded and cached.
Not in IE. It'll attempt to load a new background image regardless of whether it has cached it. (and yes, I have proper IE cach settings)
Thanks
Originally posted by scottO
Not in IE. It'll attempt to load a new background image regardless of whether it has cached it. (and yes, I have proper IE cach settings)
Hmmm, i can only explain in more detail with a live demo. Check out <!-- m --><a class="postlink" href="http://ryanbrill.com/">http://ryanbrill.com/</a><!-- m --> and notice that there is not a blink effect with Internet Explorer when a hover image is brought up as the background. (i am talking about the main navigation "Home et cetera")
Best Wishes,
DavidOriginally posted by davidbrent
Hmmm, i can only explain in more detail with a live demo. Check out <!-- m --><a class="postlink" href="http://ryanbrill.com/">http://ryanbrill.com/</a><!-- m --> and notice that there is not a blink effect with Internet Explorer when a hover image is brought up as the background. (i am talking about the main navigation "Home et cetera")
Best Wishes,
David
Hmm... oh yeah... putting the background on the li item. duh, the reason I hadn't seen this earlier is because my IE cache setting WERE wrong, contrary to what I said. I must have changed it to see a flicker on a page. (I had checked this method with IE earlier)
Sorry about that.No Problem
Glad I Could Help!
Best Wishes,
David
I want to make a rollover image for it, also. So I have the solid rollover color and the rollover image at the top.
Everything would be fine if it weren't for IE. I don't know how to prevent the flicker, because Pixy's (sp?) trick doesn't work anymore. (the trick is one background image with both images, and you change it with background positioning)
(I don't have a demo because I haven't actually started this, I'm just thinking of it.)
Any way to get around this?I don't fully understand your problem. (a demo would help) but maybe it's something to do with prelading the rollover image.
A simple css way to preload an image is to set the image somewhere (bottom?) in your page.
i.e html
<body>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"blah/yhello.gif" alt="Random" width="1" height="1" style="display:none;" />
</body>
hope that helps.
Best Wishes,
DavidOriginally posted by davidbrent
I don't fully understand your problem. (a demo would help) but maybe it's something to do with prelading the rollover image.
A simple css way to preload an image is to set the image somewhere (bottom?) in your page.
i.e html
<body>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"blah/yhello.gif" alt="Random" width="1" height="1" style="display:none;" />
</body>
hope that helps.
Best Wishes,
David
Hmm... I still don't think that would help the IE flicker because it flickers whenever the background image URL is changed.
My problem is this:
______________________
| background img here |
| |
| |
|_____________________|
I want a background image where it says "background here," and a solid color for the rest of the background.
for the hover state, I want the background img to change to another one, and I want the solid color to change also.couldn't you merge the top image and the solid colour to make a bigger imge that fits the whole nav block then just rollover with lists.
preloading the "to be rollovered" image will prevent the image being Download ed only on hover on link and Download ed as soon as the whole page is loaded and cached.Originally posted by davidbrent
couldn't you merge the top image and the solid colour to make a bigger imge that fits the whole nav block then just rollover with lists.
Yeah, I guess. I have to make it fairly big, though, because I need to cover big text sizes. I was just hoping there was another solution.
Originally posted by davidbrent preloading the "to be rollovered" image will prevent the image being Download ed only on hover on link and Download ed as soon as the whole page is loaded and cached.
Not in IE. It'll attempt to load a new background image regardless of whether it has cached it. (and yes, I have proper IE cach settings)
Thanks
Originally posted by scottO Not in IE. It'll attempt to load a new background image regardless of whether it has cached it. (and yes, I have proper IE cach settings)
Hmmm, i can only explain in more detail with a live demo. Check out <!-- m --><a class="postlink" href="http://ryanbrill.com/">http://ryanbrill.com/</a><!-- m --> and notice that there is not a blink effect with Internet Explorer when a hover image is brought up as the background. (i am talking about the main navigation "Home et cetera")
Best Wishes,
DavidOriginally posted by davidbrent
Hmmm, i can only explain in more detail with a live demo. Check out <!-- m --><a class="postlink" href="http://ryanbrill.com/">http://ryanbrill.com/</a><!-- m --> and notice that there is not a blink effect with Internet Explorer when a hover image is brought up as the background. (i am talking about the main navigation "Home et cetera")
Best Wishes,
David
Hmm... oh yeah... putting the background on the li item. duh, the reason I hadn't seen this earlier is because my IE cache setting WERE wrong, contrary to what I said. I must have changed it to see a flicker on a page. (I had checked this method with IE earlier)
Sorry about that.No Problem
Glad I Could Help!
Best Wishes,
David