Gegen Bilderklau - Das Original (https://www.gegen-bilderklau.net/index.php)
- Design, Website, Copyright (https://www.gegen-bilderklau.net/board.php?boardid=80)
--- Homepagehilfe (https://www.gegen-bilderklau.net/board.php?boardid=27)
---- Homepagehilfe - Archiv (https://www.gegen-bilderklau.net/board.php?boardid=139)
----- Hovereffekt bei Imagemap (https://www.gegen-bilderklau.net/thread.php?threadid=186086)


Geschrieben von McLissy am 23.03.2013 um 00:24:

  Hovereffekt bei Imagemap

Hallo,

ich habe meine Navigation mit Imagemap gestaltet und wollte trotzdem nicht auf einen Hovereffekt verzichten. Da ist eigentlich JS anstelle von CSS die unkompliziertere Geschichte.

Nun habe ich schonmal weitestgehend einen Erfolg verzeichnet, der Hovereffekt funktioniert...aber an einer völlig falschen Stelle. Zudem wird ein gesondertes Bild eingefügt...

Hier mal der Code:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
<html>
<head>
<title>» Phos Graphein</title>
 <script type="text/javascript">
      function ReplaceImage(filename)
      {
        document.getElementById("imagemap").src = filename;
      }
    </script>

<link rel="icon" type="image/jpg" href="favicon.jpg" />
<BODY marginwidth="0" leftmargin="0" marginheight="0" topmargin="0" scroll="auto" background="Pattern.png">
<IMG NAME="layout" SRC="Layout.png" WIDTH="1024" HEIGHT="768" BORDER="0" align="left" usemap="#menue">

<div id="Layer1" style="position: absolute;  left:387px; top: 224px;">
  <iframe src="Start.html" name="main" width="583" height="481" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
  </iframe>
</div>
<img src="hoverstart.jpg" usemap="#menue" id="imagemap"/>
<map name="menue">
<area shape="rect" coords="56,62,149,42" href="Start.html" target="main" onmouseover="ReplaceImage('hoverstart.jpg')" onmouseout="ReplaceImage('bhoverstart.jpg')">
<area shape="rect" coords="188,62,251,42" href="News.html" target="main">
<area shape="rect" coords="290,62,361,42" href="About.html" target="main">
<area shape="rect" coords="414,62,519,42" href="Fotografie.html" target="main">
<area shape="rect" coords="569,62,689,42" href="Webdesign.html" target="main">
<area shape="rect" coords="734,62,833,42" href="Angebot.html" target="main">
<area shape="rect" coords="877,62,958,42" href="Kontakt.html" target="main">
<area shape="rect" coords="904,739,980,719" href="Impressum.html" target="main">

</map>


</body>
</html>


Und so sieht das ganze dann aus:
www.phosgraphein.de.vu


Was habe ich da falsch gemacht bzw. liegts an den Koordinaten oder habe ich den imagemap sozusagen doch irgendwie doppelt definiert?

Danke im Voraus!


EDIT: Problem gefunden, IMG-Bezug doppelt definiert


Forensoftware: Burning Board, entwickelt von WoltLab GmbH