Verweissensitives Image im div?

1 Domenika

Hallo,

ich habe im Header meiner Seite ein Bild top.jpg eingefügt:

div#header {
    position:fixed;
    top:0px; 
    left:0px; 
    right:0px;
    width:800px;
    height:141px;
    background: white;
    color: black; 
    background-image:url(grafiken/top.jpg);
    background-repeat:no-repeat;
    padding:10px;
}

Im HTML-Code sieht das einfach so aus:

<div id="header"></div>

Einen Teil dieses Bildes würde ich gerne mit einem Link belegen. Dafür ist es ja notwendig im <IMG>-Tag die Info USEMAP="#NAME" einzufügen. Aber wie mache ich das in diesem Falle? Geht das überhaupt?

(Das <div><map name="NAME"> mit den Koordinaten dann zu erstellen ist kein Problem.)

Bin dankbar für Tips!

Domenika

2 C)-(iLL@

Wenn Du nicht willst, dass das Bild ohne CSS angezeigt wird, dann würde ich einen Block-Link einfügen:

<div id="header">
  <a href="http://domain.de/seite.html" title="Link auf Domain"><span>Linktext</span></a>
</div>

im CSS dann wie folgt:

div#header a span {
  display:none;
  visibility:hidden;
}
div#header a { 
  display:block;
  height:50px;
  width:60px;
  margin:20px 0 0 60px;
}

Dies würde einen quadratischen Bereich 50x60px in div#header 60px von links und 20px von oben anzeigen. Wenn Du css deaktivierst oder ein Spider das HTML durchkämmt, ist es ein normaler named Link.

Wenn es nicht ein quadratischer Bereich sondern ein Polygon ist, dann wirst Du wohl um das img und das usemap nicht drumrum kommen.

3 Domenika

Danke! Die Antworten sind oft so einfach, daß ich mich frage, wieso ich da nicht selber drauf gekommen bin ;)
Danke, jetzt klappts!

Domenika

nach oben

Verweissensitives Image im div?

Beitrag schreiben (als Gast)