| Autor |
Nachricht |
dashi
Threadersteller
Dabei seit: 16.03.2003
Ort: -
Alter: 38
Geschlecht: 
|
Verfasst Sa 27.08.2005 19:52
Titel JavaScript Schleife? oderso.. |
  |
|
Gudn Tach,
verweg ich kenne mich in Sachen JavaScript nicht gerade gut aus, soll heißen ich habe kein Plan.
Ich wollte mit eine kleine Funktion basteln, mit der ich einen div per klick vergrößen/verkleinern kann.
Das habe ich soweit auch hin bekommen *stolz ist* 
| Code: | <script language="javascript">
function big()
{
document.getElementById('slider').style.height="500";
}
function small()
{
document.getElementById('slider').style.height="100";
}
</script>
<div id="slider" style="height:100px;background-color:#000000;">test</div>
<a onClick="big()">Mach groß</a>
<br />
<a onClick="small()">Mach klein</a> |
So jetzt soll das ganze aber nicht so "schnell" passieren,
sondern halt ein bischen "animiert" ähh wie soll ich sagen "sliden" "flutschen"
Naja ihr wisst schon... 
Kann mir da biiiitte jemand helfen, komme nicht weiter 
|
|
| |
  |
 |
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst So 28.08.2005 12:15
Titel Re: JavaScript Schleife? oderso.. |
|
|
| dashi hat geschrieben: | Gudn Tach,
verweg ich kenne mich in Sachen JavaScript nicht gerade gut aus, soll heißen ich habe kein Plan.
Ich wollte mit eine kleine Funktion basteln, mit der ich einen div per klick vergrößen/verkleinern kann.
Das habe ich soweit auch hin bekommen *stolz ist*
| Code: | <script language="javascript">
function big()
{
document.getElementById('slider').style.height="500";
}
function small()
{
document.getElementById('slider').style.height="100";
}
</script>
<div id="slider" style="height:100px;background-color:#000000;">test</div>
<a onClick="big()">Mach groß</a>
<br />
<a onClick="small()">Mach klein</a> |
So jetzt soll das ganze aber nicht so "schnell" passieren,
sondern halt ein bischen "animiert" ähh wie soll ich sagen "sliden" "flutschen"
Naja ihr wisst schon...
Kann mir da biiiitte jemand helfen, komme nicht weiter |
function big()
{
for(i=0; i <= 500; i+50) {
document.getElementById('slider').style.height= i;
}
}
so in etwa sollte das gehen.
|
|
| |
|
|
|
Anzeige
|
|
|
dashi
Threadersteller
Dabei seit: 16.03.2003
Ort: -
Alter: 38
Geschlecht:
|
Verfasst So 28.08.2005 15:30
Titel
|
|
|
Hm irgendwie tut sich da jetzt nichts mehr außer:
A script on this page is causing mozilla to run slowly....... Do you wish to abort bla bla 
es funzt auch bei dem anderen nur wenn ne einheit (px) dabei steht, es sei denn man lässt den doctype weg.
Büdde nochmal gucken
Zuletzt bearbeitet von dashi am So 28.08.2005 16:42, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Account gelöscht
Ort: -
Alter: -
|
Verfasst So 28.08.2005 17:07
Titel
|
|
|
Ist auch absoluter Unsinn, da hier die tatsächliche Geschwindigkeit von deiner Hardware abhängig gemacht wird (jede Kiste kann die Schleifendurchläufe eben nur in der Zeit darstellen, die der Prozzi erlaubt).
Schau dir mal die Funktionen setTimeout() bzw. setInterval() an.
|
|
| |
|
|
dashi
Threadersteller
Dabei seit: 16.03.2003
Ort: -
Alter: 38
Geschlecht:
|
Verfasst So 28.08.2005 20:07
Titel
|
|
|
Okay danke für den Tipp Schinken, hab mich da mal schlau gemacht und
folgende Funktion gebastelt:
| Code: | <script type="text/javascript">
hoehe="285";
div="klein";
function big()
{
if(div=="klein")
{
hoehe=hoehe+2;
document.getElementById('header').style.height=hoehe;
window.setTimeout("big()",20);
if(hoehe>=478)
{
div="gross";
}
}
}
</script> |
Nur datt geht nich ^^ ich vermute mal weil wieder die "px" bzw die einheit fehlt oder!?
Aber wie kann ich die Einheit noch da unterbringen?
Zuletzt bearbeitet von dashi am So 28.08.2005 20:10, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Account gelöscht
Ort: -
Alter: -
|
Verfasst Mo 29.08.2005 11:37
Titel
|
|
|
Machet so ähnlich:
| Code: | <html>
<head>
<script type="text/javascript" language="javascript">
function big()
{
node = document.getElementById('header');
height = parseInt(node.style.height);
if (height <= 500) {
node.style.height = (height+5)+"px";
} else {
window.clearInterval(timer);
}
}
</script>
</head>
<body>
<div onmouseover="timer=setInterval('big()', 20);" id="header" style="background:black; width:200px; height:100px;">
hans
</div>
</body>
</html> |
|
|
| |
|
|
dashi
Threadersteller
Dabei seit: 16.03.2003
Ort: -
Alter: 38
Geschlecht:
|
Verfasst Mo 29.08.2005 17:10
Titel
|
|
|
absolut obespitzenklasse!!! 
Glaub ich versteh sogwar fast wie das funzt ^^
Ganz große Sache, danke danke danke 
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
[JavaScript] Bildwechsel-Schleife
[Javascript] If-Schleife greift nicht
PHP While-Schleife ()
While-Schleife in While-Schleife?
Thumbloader und Schleife
PHP - Einfache Schleife..
|
|
Willkommen auf dem Portal für Mediengestalter
