Felix Riesterer: area im div verlinken und mouseover färben

Beitrag lesen

Lieber modimidofrsaso,

und wollte in einem Viereck,

also z.B. in einem <p>-Element

das ich mit <div> erstellt habe

obwohl ein <p> mehr Sinn transportiert hätte

einen Bereich, genauer gesagt eine Ecke, verlinken

wozu ein <a>-Element das sinnvollste aller möglichen gewesen wäre

und sobald man mit dem Maus drüberfährt sollte es die Farbe wechseln.

was mit CSS ein Kinderspiel gewesen wäre.

Derzeit sieht das ganze so aus:

...

<map>
<area shape="poly" coords="250,500,500,300,450,300" onmouseover="style='background-color:#808080;'" href="index.html" title="index">
</map>

  
Warum einfach, wenn es auch maximalumständlich geht?  
  
Probiere es doch einmal so:  
  
~~~html
<html>  
    <head>  
        <title>Link-oben-rechts</title>  
        <style type="text/css">  
            .box {  
                width: 250px;  
                height: 250px;  
                padding: 0;  
                background: yellow;  
                border: 1px solid black;  
                position: relative;  
            }  
            .box a,  
            .box a:link {  
                position: absolute;  
                display: block;  
                top: 0;  
                right: 0;  
                width: 25px;  
                height: 25px;  
                background: blue;  
                text-align: center;  
            }  
            .box a:hover {  
                background: red;  
            }  
        </style>  
    </head>  
    <body>  
        <h1>Ein Quadrat mit Link oben rechts</h1>  
        <p class="box"><a href="neue-seite.htm">X</a></p>  
        <p>Die blaue rechte obere Ecke des gelben Quadrates sollte beim Überfahren der Maus rot werden.</p>  
    </body>  
</html>

Liebe Grüße,

Felix Riesterer.

--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)