nicht angemeldet
Div langsam einblenden
Servus!
Ich habe hier ein Script, das schon ziemlich meinen Vorstellungen entspricht, bis auf Folgendes:
Das Script "vergrößert" beim Klick auf "einblenden" ein div von links oben in der Ecke.
Was ich allerdings gerne hätte ist, dass beim "Einblenden" von Anfang an die Größe gleich bleibt, aber dass sich dafür die Transparenz verändert, also dass bevor man drück ist die Box 100% transparent und nach dem Klick verringert sich die Prozentzahl auf 0% oder auf 10% o.ä.
Könnte mir jemand sagen/zeigen, wie das realisierbar ist?
Anbei das Script:
<html>
<head>
<style type="text/css">
#mydiv { visibility:hidden; background-color:#FF66FF; color:#33FF33; }
</style>
<script type="text/javascript">
var reentrant = 0, h = 0, b = 0;
function div_blende(id, breite, hoehe, aktion)
{
if( ! reentrant ) {
reentrant = 1;
var move = 0, element = document.getElementById(id);
if( aktion == 'ein' ) {
if(h < hoehe ){ h += 20; move++ }
if(b < breite){ b += 20; move++ }
element.style.visibility = 'visible';
}
else if( aktion == 'aus' ) {
if(h > 0 ){ h -= 20; move++ }
if(b > 0 ){ b -= 20; move++ }
element.style.visibility = (b > 0 && h > 0) ? 'visible' : 'hidden';
}
if( move ) {
element.style.height = h + 'px';
element.style.width = b + 'px';
window.setTimeout( function(){ div_blende(id,hoehe,breite,aktion) }, 20 );
}
reentrant = 0;
}
}
</script>
</head>
<body>
<p> Test</p>
<p> <a href="#" onclick="div_blende('mydiv',300,200,'ein')">einblenden</a> /
<a href="#" onclick="div_blende('mydiv',300,200,'aus')">ausblenden</a> </p>
<div id="mydiv"> Holla </div>
</body>
</html>
Vielen herzlichen Dank im Voraus!
Liebe Grüße
Max
-
Schau hier:
http://wiki.script.aculo.us/scriptaculous/show/CombinationEffectsDemo
http://script.aculo.us/downloadsajax..
viel spaß..
lg
Phil
-
hey!
vielen dank für deine antwort!
ich werde mal versuchen, was ich da zusammenbringe ;-)
danke
lg
max
-