| Autor | Zpráva | ||
|---|---|---|---|
| Anonymny Profil * |
<style type="text/css">
#box {width:100px; height:100px; background:black}
</style>
<script type="text/javascript">
function animujBox() {
document.getElementById("box");
box.style.marginLeft="10px";
box.style.marginLeft="11px";
box.style.marginLeft="13px";
box.style.marginLeft="14px";
box.style.marginLeft="15px";
box.style.marginLeft="16px";
}
</script>
</head>
<body>
<div id="box"></div>
<script>
animujBox();
</script>Siel som na to logicky... ale nefunguje to... neviete preco? Dakujem. Moderátor Chamurappi: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
 ). |
||
| vynalezce Profil |
#2 · Zasláno: 4. 1. 2010, 17:09:46 · Upravil/a: vynalezce
Anonymny:
„Siel som na to logicky... ale nefunguje to... neviete preco?“ Prostě to proběhne příliš rychle za sebou. Použij funkci setInterval() a box.style.marginLeft=x+"px"; |
||
| shooty Profil * |
#3 · Zasláno: 4. 1. 2010, 17:32:39
To neprobehne příliš rychle za sebou. Ale probhne to v jednu dobu a platit bude jen box.style.marginLeft="16px";
musis takhle: setTimeout("box.style.marginLeft='15px'", '1000'); 1000 (ms) = 1 sekunda |
||
| shooty Profil * |
#4 · Zasláno: 4. 1. 2010, 17:35:33
priklad
function animujBox() {
var box = document.getElementById("box");
setTimeout("box.style.marginLeft='10px'", '100');
setTimeout("box.style.marginLeft='11px'", '200');
setTimeout("box.style.marginLeft='12px'", '300');
setTimeout("box.style.marginLeft='13px'", '400');
setTimeout("box.style.marginLeft='14px'", '500');
setTimeout("box.style.marginLeft='15px'", '600');
setTimeout("box.style.marginLeft='16px'", '700');
}
|
||
| vynalezce Profil |
#5 · Zasláno: 4. 1. 2010, 17:48:07 · Upravil/a: vynalezce
Mám lepší nápad
function animujBox() {
var x=10;
var box = document.getElementById("box");
interval=setInterval("presun()",100);
}
function presun(){
box.style.marginLeft=x+"px";
if(x==16){
clearInterval(interval);
}
x++;
} |
||
| Matty Profil |
#6 · Zasláno: 4. 1. 2010, 17:48:30
shooty:
Ale fuj. Co se ti nelíbí na řešení od vynalezce? |
||
| shooty Profil * |
#7 · Zasláno: 4. 1. 2010, 18:33:02
Jenom jsem opravil slogan. Toť vše :)
|
||
| Radek9 Profil |
#8 · Zasláno: 4. 1. 2010, 19:28:15 · Upravil/a: Radek9
function animujBox(){
px = 10;
interval = setInterval(function(){
box.style.marginLeft = px+"px";
px++;
if(px==16){
clearInterval(interval);
}
}, 100);
} |
||
| Anonymny Profil * |
#9 · Zasláno: 5. 1. 2010, 11:16:15
Hm.. zaujimave ale ani jedna moznost mi nefunguje :(
|
||
| peta Profil |
#10 · Zasláno: 5. 1. 2010, 15:54:14
http://peter-mlich.wz.cz/web/js/prjpw/index.html#cas
Jednoduchá animace jako Marquee Takze to shrnu 1 document.getElementById("box"); box.style.marginLeft="10px"; // chyba 1, JS konzola vyhlasi error, ze promenna box nebyla definovana, protoze v predchozim radku to neukladas do promenne 2 v tom divu nic nemas, jak poznas, ze se to animuje? odkaz na stranku? 3 interval casovani nemas nikde definovany 4 margin funguje za specialnich podminek, ze nevytece z boxu do nadrazeneho. Testoval bych to nejdriv na padingu. Nebo nadrazenemu boxu musis dat ramecek. Coz v tom prikladu neni, takze se domnivam, ze to nemas ani ve sve verzi, na kterou jsi nedal link. 5 Jak jsi prisel zrovna na tuto konstrukci? Poradil ses s google? |
||
| _es Profil |
#11 · Zasláno: 7. 1. 2010, 10:16:38
function animujBox(){
var style = document.getElementById("box").style;
var prve = 10;
var posledne = 16;
var krok = 1;
var casKrok = 100;
var i = prve;
var interval = setInterval(f, casKrok);
function f(){
if(i > posledne) clearInterval(interval);
else style.marginLeft = i + "px", i += krok;
}
} |
||
|
Časová prodleva: 13 let
|
|||
0