By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,380 Members | 1,615 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,380 IT Pros & Developers. It's quick & easy.

Image Ready Rollovers

P: n/a
This rollover script is created by Image Reaady. When using IE and
especially with Win XP the images involved in the rollover disappear.
It happens gradually with one or two at first then all. Even a browser
refresh does not bring the images back.

I there a problem known issue with Image Ready rollover scripts and IE+XP?

<script TYPE="text/javascript">
<!--
function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
login_over = newImage("images/login-over.jpg");
join_over = newImage("images/join-over.jpg");

Snip out several image preloads

preloadFlag = true;
}
}

// -->
</SCRIPT>

Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Magic-chef wrote on 28 jun 2003 in comp.lang.javascript:
I there a problem known issue with Image Ready rollover scripts and
IE+XP?


No, not to me.

Why not keep it simple:

<img src="img1.jpg"
onmouseover="this.save=this.src;this.src='img1a.jp g'"
onmouseout="this.src=this.save">
<img src="img1a.jpg" width=0 alt="preloader">
<br>
<img src="img2.jpg"
onmouseover="this.save=this.src;this.src='img2a.jp g'"
onmouseout="this.src=this.save">
<img src="img2a.jpg" width=0 alt="preloader">

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jul 20 '05 #2

P: n/a
Evertjan. wrote:
Magic-chef wrote on 28 jun 2003 in comp.lang.javascript:
I there a problem known issue with Image Ready rollover scripts and
IE+XP?

No, not to me.

Why not keep it simple:

<img src="img1.jpg"
onmouseover="this.save=this.src;this.src='img1a.jp g'"
onmouseout="this.src=this.save">
<img src="img1a.jpg" width=0 alt="preloader">
<br>
<img src="img2.jpg"
onmouseover="this.save=this.src;this.src='img2a.jp g'"
onmouseout="this.src=this.save">
<img src="img2a.jpg" width=0 alt="preloader">


So, I would use the preload function just as it is and scrap the
newimage function. The new image is replaced by onmouse*= in the image
tags.

Please excuse me as I am just starting to learn Javascript.

Jul 20 '05 #3

P: 1
Evertjan. wrote:[color=blue]
> Magic-chef wrote on 28 jun 2003 in comp.lang.javascript:
>[color=green]
>>I there a problem known issue with Image Ready rollover scripts and
>>IE+XP?[/color]
>
>
> No, not to me.
>
> Why not keep it simple:
>
> <img src="img1.jpg"
> onmouseover="this.save=this.src;this.src='img1a.jp g'"
> onmouseout="this.src=this.save">
> <img src="img1a.jpg" width=0 alt="preloader">
> <br>
> <img src="img2.jpg"
> onmouseover="this.save=this.src;this.src='img2a.jp g'"
> onmouseout="this.src=this.save">
> <img src="img2a.jpg" width=0 alt="preloader">
>
>
>[/color]

So, I would use the preload function just as it is and scrap the
newimage function. The new image is replaced by onmouse*= in the image
tags.

Please excuse me as I am just starting to learn Javascript.
Great solution, I have a lot of trouble with those darn roll-over scripts!

I have a suggestion though. when I use the width=0 for the "preloader" images, I'm still seeing a tiny box next to the real image. I am using VS .Net and IE6. The images in question are in an anchor tag in my example; this is probably the most common use, ie roll-over links...but I digress.

Instead, I used style="display:none;" in the "preloader" img tag. Bam! No tiny image link!

<a href="#" id="button1" runat="server">
<img name="enterButton_03" src="images/enterButton_03.png" width="91" height="20" border="0" alt="enter" id="IMG1" runat="server"
onmouseover="this.save=this.src;this.src='images/enterButton_03-over.png'"
onmouseout="this.src=this.save">
<img src='images/enterButton_03-over.png' style="display:none;" alt="preloader">
</a>
Apr 21 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.