Jump to content
xt:Commerce Community Forum

javascript zerschie?t header


murphy1976

Recommended Posts

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.



<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

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
  • Create New...