Change Multiple Images on Mouseover Depending on Image Mouseover-ed

**Ilan** · 12-30-2011 04:34 PM

Actually it's not opening the windows now haha

**Dragonfire2008** · 12-30-2011 04:51 PM

I was just curious, is there a real reason why you need JavaScript to do the links anyways?

**Ilan** · 12-30-2011 04:54 PM

I need the links because that's how people are going to purchase the product. The links don't have to be in javascript though, no.

**Dragonfire2008** · 12-30-2011 05:15 PM

use code such as this then...

Code:

<a target="_blank" href="www.yoursite.com/child.php></a>

**Ilan** · 12-30-2011 05:21 PM

But do I make the link the coloured one or the black and white one?

I know how to make the link but not sure where to put it in the code.

**Dragonfire2008** · 12-30-2011 05:56 PM

It's just an integration...

Code:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>

<SCRIPT LANGUAGE="JavaScript">
// Preload Images
var image0 = new Image(); image0.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png";
var image1 = new Image(); image1.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png";
var image2 = new Image(); image2.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png";
var image3 = new Image(); image3.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png";

var image4 = new Image(); image0.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png";
var image5 = new Image(); image1.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png";
var image6 = new Image(); image2.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png";
var image7 = new Image(); image3.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png";

var image8 = new Image(); image0.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png";
var image9 = new Image(); image1.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png";
var image10 = new Image(); image2.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png";
var image11 = new Image(); image3.src = "http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png";
//  End -->
</script>

</head>

<body link="#FFFFFF">

<p>
<!-- 1 EduPon -->
<a href="www.child0.com" target="_blank" onmouseover="image0.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/ac.png'; 
image1.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png'; 
image2.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png';
image3.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d2.png'; " 

onmouseout="image0.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png'; 
image1.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png'; 
image2.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png';
image3.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png';">

<img name="image0" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png"></a>
<img name="image1" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png">
<img name="image2" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png">
<img name="image3" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png">

<!-- 2 EduPons -->
<a href="www.child1.com" target="_blank"  onmouseover="image4.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bc.png'; 
image5.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/ac.png'; 
image6.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png';
image7.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d3.png'; " 

onmouseout="image4.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png'; 
image5.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png'; 
image6.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png';
image7.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png';">

<img name="image5" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png">
<img name="image4" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png"></a>
<img name="image6" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png">
<img name="image7" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png"><p>
&nbsp;
<!-- 3 EduPons -->
<a href="www.child2.com" target="_blank"  onmouseover="image8.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cc.png'; 
image9.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bc.png'; 
image10.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/ac.png';
image11.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d4.png'; " 

onmouseout="image8.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png'; 
image9.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png'; 
image10.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png';
image11.src='http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png';">

<img name="image10" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/abw.png">
<img name="image9" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/bbw.png">
<img name="image8" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/cbw.png"></a>
<img name="image11" src="http://www.payitforwardfriends.com/wordpress/wp-content/uploads/d1.png">
</body>

</html>

Thread: Change Multiple Images on Mouseover Depending on Image Mouseover-ed

Thread Tools

Display

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions