| Autor | Zpráva | ||
|---|---|---|---|
| smid83 Profil * |
#1 · Zasláno: 19. 2. 2013, 09:24:46
Ahoj Můžete mi někdo poradit? Má skript na střídání obrázků je perfektní funkční ale má to problém když jede jenom sám tak v pohodě funguje ale když chci aby na stránce jsem měl více takových obrázků tak se už nestřídá ani jeden zkoušel jsem i
přidat k obrazek.src = obrazky[obr]; obrazek1.src = obrazky1To jsem udělal i v img name obrazek1
to všechno fungovalo když jsem tam měl dvě animace ale problém je vtom že když už tam jsou nastavený 2 animace tak se tam nemůže na stránce objevit jen jedna jinak to taky nefunguje a to bych právě potřeboval aby to bylo nezávislí na sobě mám totiž stránky kde se mi obrázky střídají jednou se zobrazí méně a jednou více. celí skript je zde <script language="JavaScript" type="text/javascript">
obr = -1;
cas = 1000;
function animation(){
obrazky = ["a.gif","b.gif","c.gif"];
if (obr+1==obrazky.length) obr=0;
else obr++;
obrazek.src = obrazky[obr];
window.setTimeout('animation()',cas);
}
</script>
</head>
<body onLoad="animation()">
<img src="a.gif" name="obrazek"> |
||
| Str4wberry Profil |
#2 · Zasláno: 19. 2. 2013, 10:34:16
Nejjednodušší by asi bylo si vytvořit další funkce
animation2, animation3 s takřka totožným obsahem, které budou animovat ty další obrázky.
Nicméně mnohem lepší by to bylo napsat universálněji. Tedy si například upravit tu funkci, aby jí šlo předat, co má animovat a jaké obrázky volit. |
||
| 1Pupik1989 Profil |
Ano, volba 2 bude asi nejlepší. Něco ve stylu:
function Animate(){
this.container = arguments[0];
this.src = arguments[1];
this.i = 1;
};
Animate.prototype = {
start:function(img){
var that = this;
this.t = setTimeout(function(){
that.container.src = that.src[that.i];
that.i++;
if(that.i>=that.src.length){
that.i = 0;
}
that.start();
},1000);
},
end:function(){
clearTimeout(this.t);
}
};Vytvořit instanci a spustit. |
||
| smid83 Profil * |
#4 · Zasláno: 21. 2. 2013, 07:53:47 · Upravil/a: smid83
muže te mi tu variantu 2 napsat celý skript nějak tomu nerozumim kam a co vypsat kde vyplnit adresu obrázku atd
smid83: kam dát adresu obrazek1,obrazek2,obrazek3.atd nebo složku ze který si to bude aou tomaticky číst sám |
||
| 1Pupik1989 Profil |
#5 · Zasláno: 22. 2. 2013, 10:07:53
Tak doufal jsem, že to jde vyčíst. Ještě opraveno, netuším proč jsem použil argumenty jako pole, když nebyly potřeba.
function Animate(image,sources){
this.container = image;
this.src = sources;
this.i = 1;
};
Animate.prototype = {
start:function(img){ //spuštění animace
var that = this;
this.t = setTimeout(function(){
that.container.src = that.src[that.i];
that.i++;
if(that.i>=that.src.length){
that.i = 0;
}
that.start();
},1000);
},
end:function(){ //ukončení animace
clearTimeout(this.t);
}
};
var obrazkovy_element = document.getElementById("obrazek"); //element img, v kterém se obrázek zobrazí
var adresy_obrazku = ["1.jpg","2.jpg","3.jpg","4.jpg"]; //url adresy obrázků
var animator = new Animate(obrazkovy_element,adresy_obrazku); //vytvoření instance
animator.start(); //spuštění |
||
| smid83 Profil * |
#6 · Zasláno: 22. 2. 2013, 13:10:25
Udělal jsem to přesně takhle ale nic nefunguje zapoměl jsem snad na něco?
<script language="JavaScript" type="text/javascript">
function Animate(image,sources){
this.container = image;
this.src = sources;
this.i = 1;
};
Animate.prototype = {
start:function(img){ //spuštění animace
var that = this;
this.t = setTimeout(function(){
that.container.src = that.src[that.i];
that.i++;
if(that.i>=that.src.length){
that.i = 0;
}
that.start();
},1000);
},
end:function(){ //ukončení animace
clearTimeout(this.t);
}
};
var obrazkovy_element = document.getElementById("obrazek"); //element img, v kterém se obrázek zobrazí
var adresy_obrazku = ["http://et6.xhamster.com/t/006/1_1759006.jpg","http://et6.xhamster.com/t/006/2_1759006.jpg","http://et.xhamster.com/t/006/3_1759006.jpg","http://et6.xhamster.com/t/006/4_1759006.jpg"]; //url adresy obrázků
var animator = new Animate(obrazkovy_element,adresy_obrazku); //vytvoření instance
animator.start(); //spuštění
</script>
<body onLoad="Animate()">
<img src="a.gif" name="obrazek"></body> |
||
| Chamurappi Profil |
#7 · Zasláno: 22. 2. 2013, 13:23:09
Reaguji na smida83:
V proměnné obrazkovy_element nejspíš nic není, protože v době, kdy element podle ID hledáš, ještě neexistuje. Přesuň skript za <img>. (Obecně není moc užitečné mít skripty v <head>.)
|
||
| smid83 Profil * |
#8 · Zasláno: 22. 2. 2013, 13:44:07 · Upravil/a: smid83
Vubec ti nerozumim mezi head to nemam mam to jenom co je zde napsané tak my napiš prosim tě jak to myslíš já se nějak v js neorientuju snažim se ten zbytek co jste mi neporadili složit z toho základu co jsem posla hned na začátku jinak nevim jak ho spustit
Tak chlapi tak vám děkuju už jsem na to přišel dal jsem <img src="a.gif"name="obrazek">hned uplně nazačátek apzměnil jsem jen name na id a už to funguje diky moc ale stejně nechápu proč se teda předdím muselo používat <body onLoad="animation()"> <img src="a.gif" name="obrazek"> |
||
| _es Profil |
#9 · Zasláno: 22. 2. 2013, 13:56:59
smid83:
„mezi head to nemam“ Máš to nad značkou <body> tak to snáď je v elemente head - nie? „Vubec ti nerozumim“ Čo je na vete „Přesuň skript za <img>.“ nezrozumiteľné?
|
||
| smid83 Profil * |
#10 · Zasláno: 22. 2. 2013, 14:18:59
Ted jak uřž to jde tak to funguje i když je img před tim nebo zatím je to jedno
|
||
| 1Pupik1989 Profil |
#11 · Zasláno: 22. 2. 2013, 15:14:26
Ano, mělo by to být jedno, pokud se to spouští až v onloadu body. Hezčí je si ale funkce přesunout do externího dokumentu.
|
||
| smid83 Profil * |
#12 · Zasláno: 22. 2. 2013, 15:55:31
Je promin máš pravdu musíš v tom mít to body já to nějak poplet ale prosimtmě porat mi ještě dál jsem do body
<body onLoad="Animate()"> <img src="a.gif" name="obrazek"> </body> |
||
|
Časová prodleva: 15 dní
|
|||
| 1Pupik1989 Profil |
#13 · Zasláno: 9. 3. 2013, 15:49:06
Vytvoř si funkci třeba
nastavAnimaci, která vytvoří objekt a spustí animaci.
<body onLoad="nastavAnimaci()"> <img src="a.gif" name="obrazek"> </body> Ve funkci nastavAnimaci pak bude:
var animator = new Animate(obrazkovy_element,adresy_obrazku); //vytvoření instance animator.start(); //spuštění |
||
|
Časová prodleva: 11 let
|
|||
0