Beat: onmouseover-Effekt

Beitrag lesen

Mal ganz ohne Java-Script
Aber mit CSS.

Der/Die/Das HTML

  
<button  
    name="some_name"  
    value="some_value"  
    id="hoverbutton"  

>Click Mich<img  

    class="hidden"  
    src="some_path_to_source"  
    alt="some_missing_img_info"  

></button>  

Der/Die/Das CSS

  
#hoverbutton {  
    position:relative;  
}  
#hoverbutton img.hidden {  
    position:absolute;  
    display:none;  
    top:5em;  
    left: 5em;  
}  
#hoverbutton:hover img.hidden,  
#hoverbutton:focus img.hidden {  
    display:block;  
}  

Der Code ist etwas aus der Hüfte geschossen und muss angepasst werden.

Info: die Positionierung des Bildes basiert auf dem nächsten Parent Element, das nicht position:static ist.

mfg Beat