10.05.2006, 13:57
|
|||
|
|||
Hi,
ich habe ein Javascript erzeugt, dass einzelne Bildelemente als grafische Links im Header beim mouseover austauschen soll. Der Header wurde in photoshop gesliced und die Bilder sind in nun einer Tabelle zum Header zusammengesetzt, soweit so wunderbar. Das Javascript habe ich nun in die general.js-datein eingebunden, und die entsprechenden Tabellenzellen, in denen sich die auszutauschenden Bilder befinden, mit den entsprechenden js-angaben versehen. Jedoch wird mir der header dabei f?rmlich auseinandergerissen (wei?e Felder). Am besten ich poste hier mal das JS samt den Angaben im Body die ich in die jeweiligen Tabellenzellen eingef?gt habe. Code:
<script language="JavaScript" type="text/javascript">
<!-- hide
browserName = navigator.appName; browserVer = parseInt(navigator.appVersion); browser = "NotOk";
// Detect if Netscape or MSIE version is ok
if (browserName == "Netscape" && browserVer >= 3) { browser = "ok"}
if (browserName == "Microsoft Internet Explorer" && browserVer >= 4) { browser = "ok"}
// Initialize your images
if (browser == "ok") {
Link1= new Image(); Link1.src = "{$tpl_path}himg\header_02.gif";
Link1on = new Image(); Link1on.src = "{$tpl_path}hovimg\header_02.gif";
Link2= new Image(); Link2.src = "{$tpl_path}himg\header_09.gif";
Link2on = new Image(); Link2on.src = "{$tpl_path}hovimg\header_09.gif";
Link3= new Image(); Link3.src = "{$tpl_path}himg\header_10.gif";
Link3on = new Image(); Link3on.src = "{$tpl_path}hovimg\header_10.gif";
Link4= new Image(); Link4.src = "{$tpl_path}himg\header_11.gif";
Link4on = new Image(); Link4on.src = "{$tpl_path}hovimg/header_11.gif";
Link5= new Image(); Link5.src = "{$tpl_path}himg\header_14.gif";
Link5on = new Image(); Link5on.src = "{$tpl_path}hovimg\header_14.gif";
Link6= new Image(); Link6.src = "{$tpl_path}himg\header_15.gif";
Link6on = new Image(); Link6on.src = "{$tpl_path}hovimg\header_15.gif";
Link7= new Image(); Link7.src = "{$tpl_path}himg\header_20.gif";
Link7on = new Image(); Link7on.src = "{$tpl_path}hovimg\header_20.gif";
}
function swap(imgName,select)
{ if (browser == "ok") {imgOn = eval(select+ ".src");
document.images[imgName].src = imgOn; }}
//-->
</script>
</head>
<body>
<a href="http://irgendwas"
onmouseover="swap('imgLink1','Link1on')"
onmouseout="swap('imgLink1','Link1')">
<img name ="imgLink1"
src= "{$tpl_path}himg\header_02.gif" border = 0 alt = "home" hspace="214" vspace="27"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink2','Link2on')"
onmouseout="swap('imgLink2','Link2')">
<img name ="imgLink2"
src= "{$tpl_path}himg\header_09.gif" border = 0 alt = "agbs" hspace="175" vspace="27"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink3','Link3on')"
onmouseout="swap('imgLink3','Link3')">
<img name ="imgLink3"
src= "{$tpl_path}himg\header_10.gif" border = 0 alt = "versand" hspace="175" vspace="27"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink4','Link4on')"
onmouseout="swap('imgLink4','Link4')">
<img name ="imgLink4"
src= "{$tpl_path}himg\header_11.gif" border = 0 alt = "impressum" hspace="175" vspace="27"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink5','Link5on')"
onmouseout="swap('imgLink5','Link5')">
<img name ="imgLink5"
src= "{$tpl_path}himg\header_14.gif" border = 0 alt = "kontakt" hspace="175" vspace="37"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink6','Link6on')"
onmouseout="swap('imgLink6','Link6')">
<img name ="imgLink6"
src= "{$tpl_path}himg\header_15.gif" border = 0 alt = "hilfe" hspace="160" vspace="76"></a>
<a href="http://irgendwas"
onmouseover="swap('imgLink7','Link7on')"
onmouseout="swap('imgLink7','Link7')">
<img name ="imgLink7"
src= "{$tpl_path}himg\header_20.gif" border = 0 alt = "advanced_search" hspace="175" vspace="39"></a>
</body>
</html>
Wie ihr seht, handelt es sich also um insgesamt 7 grafische Link-Buttons, die durch ein onmouseover-image ersetzt werden sollen Mit den jeweiligen Angaben im Bodytag habe ich an die entsprechenden Zellen der headertabelle (in der index.html) die normalen img-src ersetzt. also etwa so <td><a href="http://irgendwas" onmouseover="swap('imgLink7','Link7on')" onmouseout="swap('imgLink7','Link7')"> <img name ="imgLink7" src= "{$tpl_path}himg\header_20.gif" border = 0 alt = "advanced_search" hspace="175" vspace="39"></a></td> Kann mir jemand helfen auch ein JS-Beispiel mit dem es m?glich ist? Vielleicht ist das js auch falsch? Oder muss ich etwas spezielles dabei beachten, wenn man JS in Tabellenzellen integriert? Ich steh irgendwie arg aufm schlauch! 1000 dank schon mal Murphy      
|
 |
| Lesezeichen |
| Stichworte |
| header, javascript, zerschiet |
| Themen-Optionen | |
| Ansicht | |
Linear-Darstellung
|
|
Alle Zeitangaben in WEZ +1. Es ist jetzt 09:03 Uhr.