Zoom-Funktion - Website X5 Hilfe - Die Helpsite

Direkt zum Seiteninhalt

Hauptmenü:

Zoom-Funktion

Scripte > Bildobjekte


Bildobjekte mit verzögertem Zoom-Effekt.


Bilder auf den Server in das Verzeichnis "images" kopieren.
Example:
demo_img2.jpg
demo_img3.jpg


Demo:


Hauseingang

Vorgarten


Code für den HEAD-Bereich:

<script type="text/javascript">

var zaehler = 50;
function aufmachen(breite,ID) {
if (zaehler < breite) {
 document.getElementById(ID).style.display="inline";
 document.getElementById(ID).style.width=zaehler+"px";
 zaehler += 10;
 window.setTimeout("aufmachen("+breite+",'"+ID+"')",0);
}
else {
 document.getElementById("beschreibung-"+ID).style.display="block";
}
}
function zumachen(ID) {
document.getElementById(ID).style.display="none";
document.getElementById("beschreibung-"+ID).style.display="none";
zaehler = 50;
}
</script>

<style type="text/css">
.bereich {
position: absolute;
text-align: center;
font-weight: bold;
}

.beschreibung {
color: #FFFFFF;
background-color: #000000;
display: none;
}
</style>



Code für das HTML-Objekt:

<span class="bereich">
<img src="images/demo_img2.jpg" alt="" style="display: none;" id='bild_2' border="0" onMouseOut="zumachen('bild_2');"><br>
<span id="beschreibung-bild_2" class="beschreibung">
Hauseingang
</span>
</span>
<img src="images/demo_img2.jpg" width="190" height="140" border="0" onClick="aufmachen(300,'bild_2');" style="margin-right: 15px; cursor: pointer;">

<span class="bereich">
<img src="/images/demo_img3.jpg" alt="" style="display: none;" id='bild_3' border="0" onMouseOut="zumachen('bild_3');"><br>
<span id="beschreibung-bild_3" class="beschreibung">
Vorgarten
</span>
</span>
<img src="images/demo_img3.jpg" width="190" height="140" border="0" onClick="aufmachen(300,'bild_3');" style="margin-right: 15px; cursor: pointer;">


Feedbacks zu ""

es gibt insgesamt 0 Kommentar(e)



Name*
Vorname
Kommentar*
Email *
Homepage
Telefon
Sicherheitscode *
 
Logo HTML5
Button Spenden

© 2009 - 2018




  Besucher Statistik
 » 4 Online
 » 18 Heute
 » 997 Woche
 » 3784 Monat
 » 53012 Jahr
 » 299590 Gesamt
Rekord: 1420 (10.04.2014)
Zurück zum Seiteninhalt | Zurück zum Hauptmenü