Autor | Zpráva | ||
---|---|---|---|
epsík Profil |
#1 · Zasláno: 18. 9. 2007, 17:54:21
nemohu přijít na zásadní věc. Udělal jsem si javascriptovou akci, která dynymicky zvětšuje obrázek po přejetí myší a po odjetí se opět zmenšuje až na původní vekost. Script funguje, pokud ho použiji na jeden oběkt, ale nevím, jak to udělat, aby se tento script mohl provádět najednou u více obrázku..tzn. když z jednoho odjedu na jiný, aby se ten začal zvětšovat, zatímco se původní vrací na původní rozměr. Chyba je samozřejmě v tom, že se navzájem tlučou proměnné, ale nevím jak řešit, aby se tak nedělo...
function zvetseni(){ velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost+4; objekt.style.height =velikost+4; objekt.style.left =poziceX-2; objekt.style.top =poziceY-2; if(velikost>=200){ clearInterval(akce); } } function zmenseni(){ velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost-4; objekt.style.height =velikost-4; objekt.style.left =poziceX+2; objekt.style.top =poziceY+2; if(velikost<=114){ clearInterval(akce2); } } function velikost(i){ nahled="nahled"+i; objekt=document.getElementById(nahled); akce=setInterval("zvetseni()",4); } function velikost_zpet(i){ clearInterval(akce); akce2=setInterval("zmenseni()",4); } //a zde akci volám <? ... echo "<a href='./obsah.php?img=$id&pict=1' class='thickbox'><img id='nahled$i' src='./upload/$id/nahledy/nahled_vetsi.png' onmouseover='velikost($i);' onMouseOut='velikost_zpet($i);'></a>"; ... ?> podívat se můžete zde (na stránkách zrovna pracuji, takže to možná nebude zrovna fungovat) http://ouch.cz/test Děkuji předem za odpovědi |
||
Bronzi Profil |
#2 · Zasláno: 18. 9. 2007, 19:41:25
Musíš to pojmout trochu globálněji. Hlavní příčina je v tom že si vyměníš jeden časovač za druhý když ten ředchozí je ještě potřeba.
Zaveď si na začátku pole var akce = new Array(); var akce2 = new Array(); a 2 proměné var pocetAkci = 0; var pocetAkci2 = 0; Pak pozměň funkce velikost(i) a velikost_zpet(i) takto function velikost(i){ nahled="nahled"+i; objekt=document.getElementById(nahled); akce[pocetAkci] =setInterval("zvetseni("+pocetAkci+")",4); // funkce zvětšení se bude volat z indexem svého časovače aby se vědělo, který časovač se má odnastavit pocetAkci++; // zvětším číslo aby se příště změnila proměná akce[pocetAkci] } function velikost_zpet(i){ clearInterval(akce); akce2[pocetAkci2]=setInterval("zmenseni("+pocetAkci2+")",4); pocetAkci2++; // totéž jako předtím } A funkce zvetseni() a zmenseni() takto: function zvetseni(casovac){ velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost+4; objekt.style.height =velikost+4; objekt.style.left =poziceX-2; objekt.style.top =poziceY-2; if(velikost>=200){ clearInterval(akce[casovac]); // odnastavíme časovač akce[casovac] = null;// proměnou vynulujem aby nežrala paměť } } function zmenseni(casovac){ velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost-4; objekt.style.height =velikost-4; objekt.style.left =poziceX+2; objekt.style.top =poziceY+2; if(velikost<=114){ clearInterval(akce2[casovac]); akce1[casovac] = null; } } Snad jsem se nikde nesek. |
||
epsík Profil |
#3 · Zasláno: 18. 9. 2007, 20:46:48
hmm..tak bohužel mi to nefunguje...snažil jsem se najít nějaké chyby, např.
clearInterval(akce); jsem změnil na clearInterval(akce[pocetAkci]); a akce1[casovac] = null; na akce2[casovac] = null; ale stále to nefunguje...jednou se provede zvětšení a zmenšení, ale poté, ať přejedu přes jakýkoli náhled, tak se ten první vždy zmenší o jednotku (velikost-4)...takže netuším... neměl bych si ještě udělat pole pro každou proměnnou (např. velikost[pocetAkci])?..jdu to zkusit |
||
Bronzi Profil |
#4 · Zasláno: 18. 9. 2007, 21:19:44
Ne to je zbytečné velikost zjišťuješ až v těle té funkce ale udělej pole z proměné objekt analogicky jak s časovačema.
var objekt1 = new Array(); var objekt2 = new Array(); function velikost(i){ nahled="nahled"+i; objekt1[pocetAkci]=document.getElementById(nahled); akce[pocetAkci] =setInterval("zvetseni("+pocetAkci+")",4); pocetAkci++; } a velikost_zpet udelj takto function velikost_zpet(i){ //ještě jsem odtud odstranil clearInterval() nahled="nahled"+i; objekt2[pocetAkci2]=document.getElementById(nahled); akce2[pocetAkci2]=setInterval("zmenseni("+pocetAkci2+")",4); pocetAkci2++; } a zbytek ještě uprav takto: function zvetseni(casovac){ var objekt = objekt1[casovac]; velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost+4; objekt.style.height =velikost+4; objekt.style.left =poziceX-2; objekt.style.top =poziceY-2; if(velikost>=200){ clearInterval(akce[casovac]); // odnastavíme časovač akce[casovac] = null;// proměnou vynulujem aby nežrala paměť } } function zmenseni(casovac){ var objekt = objekt2[casovac]; velikost = objekt.width; poziceX = objekt.offsetLeft; poziceY = objekt.offsetTop; objekt.style.width =velikost-4; objekt.style.height =velikost-4; objekt.style.left =poziceX+2; objekt.style.top =poziceY+2; if(velikost<=114){ clearInterval(akce2[casovac]); akce2[casovac] = null; } } Tak snad teď |
||
epsík Profil |
#5 · Zasláno: 18. 9. 2007, 21:58:49
ououououou...stále mi to né a né fungovat...díky moc za pomoc, ten princip je určitě fajn a ještě ho určitě využiju, ale vždy když se provede ta první akce (velikost a velikost_zpet), tak u těch dalších už to nefunguje a zmenšují se o tu jednu jednotku....rozdíl je teď v tom, že už to reaguje správně vždy pro ten konkrétní náhled, ale něco se v tom scriptu permanentně změní po té první akci...už opravdu nevím, co s tím...lopotím se s tím od rána a opravdu už nevím..jediné co mi jakž takž fungovalo, když jsem nechal php scriptem vygenerovat pro každý náhled zvlášť tuto funkci, ale to je přecijen prasárna...
|
||
ah01 Profil |
#6 · Zasláno: 18. 9. 2007, 22:39:44
epsík
Kód, který uvádí Bronzi je zbytečně komplikovaný. Přitom se to dá řešit velice elegantně, bez jakéhokoliv „blbnutí“ s globálním polem. Nebudu ti, ale psát kompletní řešení (to je takřka už zakázková práce), musíš se také trochu snažit. Nehledě na to, že tak se to člověk nejlépe naučí. Projdi si následnou kostru kódu. Určitě to pak zvládneš doplnit na funkční celek. function setup( img ){ Pokud ti nebude něco jasné, proč nebo jak to funguje, klidně se ptej. |
||
epsík Profil |
#7 · Zasláno: 18. 9. 2007, 23:22:44
ah01 no zdá se to jako pěkný řešení...nicméně je to pro mě trochu alchymie. znamená to tedy že do těla dokumentu vložím akorát setup( document.getElementById("obr") );? ...přiznám se ale, že vůbec nevím kam a jak..
Jinak ten zbytek poměrně chápu a přiznám se, že jsem vůbec netušil, že jde tímto způsobem nastavit obsluhu událostí...jestli to tedy dobře chápu, že to zůstává uvnitř scriptu a nevypisuji to přímo do obrázku... ...jo a pokud jde o originalWidth a originalHeight, můžu je nastavit na img.width a img.height? ...no, ale s tím si asi už poradím...spíš mě zajímá kam s tím setup... ..jo a ještě si nejsem jistý jestli je toto správně: if( img.width > originalWidth || img.height < originalHeight ) ..omluv mě, jestli se ptám blbě ;) |
||
ah01 Profil |
#8 · Zasláno: 18. 9. 2007, 23:42:48
epsík
Pokud jsi začátečník, tak na tebe tento způsob psaní kódu může působit jako alchymie. Pokud v tom tápeš úplně, tak můj příspěvek ignoruj a snaž se to vyřešit s tím, co znáš. ad 1: fci. setup pochopitelně voláš až po načtení stránky (událost onload) ad 2: „jestli to tedy dobře chápu, že to zůstává uvnitř scriptu a nevypisuji to přímo do obrázku“ ano přesně tak, jde o to, aby se do vlastního HTML kódu psalo co nejméně (žádný) JS a vkládal se jen do hlavičky jako externí script (tzv. unobtrusive javascript) ad 3: to jsem jen tak střelil od boku, aby bylo vidět, co zhruba by v těch částech kódu mělo být napsané. Musíš si tam dospat kód podle toho co to má dělat. |
||
epsík Profil |
#9 · Zasláno: 19. 9. 2007, 00:06:39
ah01
miluju tě :)) tak po přepsání pár drobností to funguje naprosto perfektně a nemusím se bát že se ty scripty budou nějak mezi sebou bít. Tento způsob je pro mě úplná novinka a už vidím, jak přepisuji své staré zlobící scripty...děkuju moc Rovněž děkuju Bronzi za zajímavé informace a snahu pomoci :) ...později sem ještě hodím hotový script |
||
Časová prodleva: 17 let
|
0