Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Cross browser code to swap images 1

Status
Not open for further replies.
hablablow

hablablow

Programmer
Sep 9, 2000
115
FR
On a previous thread we discussed with RobSchultz on how to swap images together
( thanks again to Rob for his advices). But i can't go on and make this work on Netscape.
I have two images A and B and two rollower roll_A and roll_B
and i want them to swap each other.
If anyone knows would be very helpfull. Here is the code:
<html>
<head>
<script language=&quot;javascript&quot;>
<!-- Hide from old browsers
var IE = document.all
function fnSwapNumber(type){
if (type==1){
if (!IE){
document.design.src=&quot;1/roll_A.gif&quot;;
document.web.src=1/roll_B.gif&quot;;}

else{
design.src=&quot;1/roll_A.gif&quot;;
web.src=&quot;1/roll_B.gif&quot;;}}

else{
if (!IE){
document.design.src=&quot;1/A.gif&quot;;
document.web.src=&quot;1/B.gif&quot;;}
else{
design.src=&quot;1/A.gif&quot;;
web.src=&quot;1/B.gif&quot;;}}
}
// -->
</script>

</head>

<body>
<table><tr>
<td><a href=&quot;#&quot;><img src=&quot;pageint/design.gif&quot; name=&quot;design&quot; onmouseover=&quot;fnSwapNumber(1)&quot;
onmouseout=&quot;fnSwapNumber(0)&quot; onload=&quot;&quot; border=&quot;0&quot;</a></td>
<td><a href=&quot;#&quot;><img src=&quot;pageint/web.gif&quot; name=&quot;web&quot; onmouseover=&quot;fnSwapNumber(1)&quot;
onmouseout=&quot;fnSwapNumber(0)&quot; onload=&quot;&quot; border=&quot;0&quot;></a></td>
</tr></table>
</body>
</html> [sig][/sig]
 
Sort by date Sort by votes
Upvote 0 Downvote
You need to preload the images:

var A=new Image();
A.src=&quot;1/A.gif&quot;;
var B=new Image();
B.src=&quot;1/B.gif&quot;;

and so on...

Then, when the rollover occurs:

document.design.src=A.src;

and so on...

This way, the browser doesn't make a request of the server each time a mouseover/mouseout event occurs.

Also, you don't need to test for browsers in this case, you can just use

document.images['design'].src=A.src;

for both IE and Netscape.

Regards, [sig]<p>Russ<br><a href=mailto:bobbitts@hotmail.com>bobbitts@hotmail.com</a><br><a href= is in</a><br>[/sig]
 
Upvote 0 Downvote
Thanks for both of you for your answers.
Caf, i followed your links and understood a few helpfull tips about netscape.
Russ thanks a lot for your clear explanation and....It works !!
I can have what i wanted from netscape and explorer.
Cool stuff <--------------------> cool minds.
Thanks.
Hablablow. [sig][/sig]
 
Upvote 0 Downvote
check out cdw.com navigation menu it is not running in netscape just save as the page through IE5 and run on netscape the menu is not displaying perfectly but on the website it is displaying perfectly but the hiererchy is not retrieving pls check it out and let me know so i can...
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
634
Kennelbloke
Kennelbloke
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
499
rogerte
rogerte
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
538
lexer
lexer
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
614
xwb
xwb
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
485
Rayj0000
Rayj0000

Part and Inventory Search

Sponsor

Back
Top