foto html - css     . Cliparts - Blurovergang

Omschrijving   Voorbeeld

Een prachtige mouse-over die zodra je met je muis op de foto gaat staan in een andere foto veranderd.  

In de css

#cf {
position:relative;
height:225px;
width:300px;
margin:0 auto;} #cf img {
position:absolute;
left:0;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;}

#cf img.top:hover {
opacity:0;}

Tussen de bodytags

<div id="cf">
<img class="bottom" src="onderste foto" />
<img class="top" src="bovenste foto" /></div>

end
terug
home