mouseover problem
Hallo liebes Forum,
nun bräuchte ich eure Hilfe!
Mein Navigation funktioniert soweit perfekt! Doch meine "Subnavi" im Footer funktioniert leider nicht so wie ich es möchte!
Wenn ich zb. im Content ein Bild einfüge und mit der Maus über das "Subnavi" fahre, wechselt es mir das Contentbild, anstatt das eigentliche Navibutton-Bild!
Hier der html Code
Javascript code:
Code:
// JavaScript Document
Normal1 = new Image();
Normal1.src = "img/menu_02.jpg";
Highlight1 = new Image();
Highlight1.src = "img/menu_over_02.jpg";
Normal2 = new Image();
Normal2.src = "img/menu_04.jpg";
Highlight2 = new Image();
Highlight2.src = "img/menu_over_04.jpg";
Normal3 = new Image();
Normal3.src = "img/menu_06.jpg";
Highlight3 = new Image();
Highlight3.src = "img/menu_over_06.jpg";
Normal4 = new Image();
Normal4.src = "img/menu_10.jpg";
Highlight4 = new Image();
Highlight4.src = "img/menu_over_10.jpg";
Normal5 = new Image();
Normal5.src = "img/menu_12.jpg";
Highlight5 = new Image();
Highlight5.src = "img/menu_over_12.jpg";
Normal6 = new Image();
Normal6.src = "img/menu_14.jpg";
Highlight6 = new Image();
Highlight6.src = "img/menu_over_14.jpg";
Normal7 = new Image();
Normal7.src = "img/menu_16.jpg";
Highlight7 = new Image();
Highlight7.src = "img/menu_over_16.jpg";
Normal8 = new Image();
Normal8.src = "img/menu_unten_02.gif";
Highlight8 = new Image();
Highlight8.src = "img/menu_unten_over_02.gif";
Normal9 = new Image();
Normal9.src = "img/menu_unten_04.gif";
Highlight9 = new Image();
Highlight9.src = "img/menu_unten_over_04.gif";
Normal10 = new Image();
Normal10.src = "img/menu_unten_06.gif";
Highlight10 = new Image();
Highlight10.src = "img/menu_unten_over_06.gif";
function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
HTML:
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>...</title>
<meta name="description" content="description"/>
<meta name="keywords" content="keywords"/>
<meta name="abstract" content=""/>
<meta name="language" content="de"/>
<meta name="author" content="..."/>
<meta name="publisher" content="..."/>
<meta name="copyright" content="..."/>
<meta name="rating" content="General"/>
<meta name="audience" content="ALLE"/>
<meta name="robots" content="INDEX,FOLLOW"/>
<meta name="revisit-after" content="1 month"/>
<link href="main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="common.js"></script>
</head>
<body>
<div id="wrap">
<div id="head">
<div id="logo"></div>
<div id="menu"><a href="serviceleistungen.html" onmouseover="Bildwechsel(0,Highlight1)" onmouseout="Bildwechsel(0,Normal1)"><img src="img/menu_02.jpg" width="85" height="36" alt="menu" border="0" /></a><a href="#" onmouseover="Bildwechsel(7,Highlight8)" onmouseout="Bildwechsel(7,Normal8)"></a><a href="produktpalette.html" onmouseover="Bildwechsel(1,Highlight2)" onmouseout="Bildwechsel(1,Normal2)"><img src="img/menu_04.jpg" width="96" height="36" alt="menu" border="0" /></a><a href="kontakt.html" onmouseover="Bildwechsel(2,Highlight3)" onmouseout="Bildwechsel(2,Normal3)"><img src="img/menu_06.jpg" width="106" height="36" alt="menu" border="0" /></a><a href="firmenhistorie.html" onmouseover="Bildwechsel(3,Highlight4)" onmouseout="Bildwechsel(3,Normal4)"><img src="img/menu_10.jpg" width="129" height="36" alt="menu" border="0" /></a><a href="referenzen.html" onmouseover="Bildwechsel(4,Highlight5)" onmouseout="Bildwechsel(4,Normal5)"><img src="img/menu_12.jpg" width="130" height="36" alt="menu" border="0" /></a><a href="referenzen.html" onmouseover="Bildwechsel(5,Highlight6)" onmouseout="Bildwechsel(5,Normal6)"><img src="img/menu_14.jpg" width="84" height="36" alt="menu" border="0" /></a><a href="referenzen.html" onmouseover="Bildwechsel(6,Highlight7)" onmouseout="Bildwechsel(6,Normal7)"><img src="img/menu_16.jpg" width="108" height="36" alt="menu" border="0" /></a><br />
</div>
</div>
<div id="content">
<h1>Herzlich Willkommen</h1>
<p>text</p>
<img src="img/home_rechts.jpg" alt="home_bild_rechts" width="177" height="400" name="home_rechts" />
</div>
<div id="foot">
<a href="serviceleistungen.html" onmouseover="Bildwechsel(7,Highlight8)" onmouseout="Bildwechsel(7,Normal8)"><img src="img/menu_unten_02.gif" width="734" height="36" alt="menu" border="0" /></a><a href="produktpalette.html" onmouseover="Bildwechsel(8,Highlight9)" onmouseout="Bildwechsel(8,Normal9)"><img src="img/menu_unten_04.gif" width="85" height="36" alt="menu" border="0" /></a><a href="kontakt.html" onmouseover="Bildwechsel(9,Highlight10)" onmouseout="Bildwechsel(9,Normal10)"><img src="img/menu_unten_06.gif" width="118" height="36" alt="menu" border="0" /></a>
</div>
</div>
</body>
</html>
Ich denke mal das es an der Reihenfolge liegt, aber mir nicht so sicher!
Vielleicht sehe ich auch vor lauter Bäumen den Wald nicht mehr :)
Danke an alle Helfer!
Hab es gelöst:
HTML-Code:
<html>
<head>
<script
language="JavaScript">
<!--
button1_a= new Image();
button1_a.src = "link01_start.gif"
button1_b= new Image();
button1_b.src = "link01_over.gif"
button2_a= new Image();
button2_a.src = "link02_start.gif"
button2_b= new Image();
button2_b.src = "link02_over.gif"
button3_a= new Image();
button3_a.src = "link03_start.gif"
button3_b= new Image();
button3_b.src = "link03_over.gif"
button4_a= new Image();
button4_a.src = "link04_start.gif"
button4_b= new Image();
button4_b.src = "link04_over.gif"
/* usw. für alle Grafiken,
die am Mouse-Over-Effekt beteiligt sind */
//-->
</script>
</head>
<body>
<a href="beispiel.html" onmouseover="austausch1.src='link01_over.gif';"
onmouseout="austausch1.src='link01_start.gif'"><img src="link01_start.gif"
border="0" width="150" height="30"
name="austausch1"></a>
<a href="beispiel2.html" onmouseover="austausch2.src='link02_over.gif';"
onmouseout="austausch2.src='link02_start.gif'"><img src="link02_start.gif"
border="0" width="150" height="30"
name="austausch2"></a>
<a href="beispiel3.html" onmouseover="austausch3.src='link03_over.gif';"
onmouseout="austausch3.src='link03_start.gif'"><img src="link03_start.gif"
border="0" width="150" height="30"
name="austausch3"></a>
<a href="beispiel4.html" onmouseover="austausch4.src='link04_over.gif';"
onmouseout="austausch4.src='link04_start.gif'"><img src="link04_start.gif"
border="0" width="150" height="30"
name="austausch4"></a>
</body>
</html>
|
