[JS] Jak płynnie powiększyć obrazek?

0

W jaki sposob mozna plynnie powiekszyc obrazek(np buttona)?
Plynnie czyli tak aby bylo widac ze sie powieksza ;-)
I bylo by dobrze gdyby mozna bylo to zrobic za pomoca jakies jednej funkcji - uniwersalnej, czyli takiej ktora moge stosowac dla jakiego kolwiek obrazka. Bo do jednego juz po ciezkich :-[ bojach udalo mi sie napisac, ale wklepywac 29 funkcji na strone do kazdego buttona to przeciez zadne wyjscie [glowa]

0

Jeżeli udało ci się po ciężkich bojach zrobić jeden to dziwi
mnie dlaczego dowolna ilość jest przeszkodą ? Mógł byś pokazać
co tam wykodziłeś...

Jeśli chodzi o odpowiedź to mógł bym Ci zarzucić jakimś
przykładem ale z tego co napisałeś to chyba sobie radzisz w JS
więc odsyłam Cię do biblioteki Alladyn ( http://alladyn.art.pl )
Znajdziesz w niej funkcję dzięki której będziesz mógł zmieniać
rozmiary dowolnego obrazka w dowolnym czasie i płynności...

P.S. Przeczytaj dobrze dokumentacje, są w niej takie przykłady...

0

Nie wiem czy sobie radze w js, uczylem sie tego przez dwa dni (przeczytane 4 ksiazki) ale tylko po to aby cos zrobic, co mi akurat wtedy przyszlo do glowy. A teraz przyszla mi ta animacja, ale juz nie jest tak dobrze....
Kodu nie da sie powielic bo to jest dosyc duzy kod :-/
i zwieksza bardzo objetosc strony i jest niewygodny i <ort>w ogóle</ort> 8-0
Jest to raczej taki domowy sposob na powiekszanie :-), pewnie w js jest masa innych przydatnych funkcji o ktorych nic nie wiem

[code]

<script language="javascript"> powiekszanie=false; zmniejszanie=true; czas=5; zmn=0; function powieksz() { if ((powiekszanie==true) & (zmniejszanie==false)) { if (td1.height-4>wsk.height) { wsk.height+=2; wsk.width+=2; } else clearInterval(pow); } else clearInterval(pow); }; function zmniejsz() { if ((powiekszanie==false) & (zmniejszanie==true)) { clearInterval(pow); if (wsk.height>39) { wsk.height-=2; if (wsk.width>174) wsk.width-=2; } else clearInterval(zmn); } else clearInterval(zmn); }; </script> <body>
home.gif
[/code]
0

Niom, rzeczywiście problem nie jest prosty, ale przynajmniej
doczekałem się w końcu ciekawego pytania a nie ciągle
"jak otworzyć okienko" itp... blahhhhh....

Jak wiadomo JavaScript to sztuka wybierania mniejszego zła,
przykład który napisałem może nie działać we wszystkich
przeglądarkach ale powinien w tych które obsługują DOM
więc powinno być wszystko OK, testowałem na IE 6, Phoenix 0.5

Nie będę wklejał na forum bo HTML się tutaj kaszani więc
jest pod adresem: http://piechnat.iglu.cz/upload/imgTest.html

[<font color="blue">dopisane</span>]

dodam jeszcze, że argumenty w funkcji initImg() są następujące:
this,
końcowa szerokość obrazka,
końcowa wysokość obrazka,
ilość kroków,
czas wykonania jednego kroku w milisekundach

0

sprytne [hurra]
u mnie wlasnie najgorszy byl problem przekazania wskaznika do obrazka,
po drugim wywolaniu intervala wszystko mi siadalo (tzn, funkcja miala nieprawidlowy parametr)
wiec jedyny sposob to ort! kazdej funkcji kazdemu obrazkowi, w czym Twoj sposob jest rzeczywiscie bardzo dobry.
Gratuluje i Dziekuje.
Jeszcze pokombinuje (dzis w pracy wpadlem na fajny sposob) i jak cos wymysle to wklepie w tym temacie.
Jeszcze raz dzieki. [cya]

0

Po ciezkich bojach (znow :-D ), aby jak najmniej kodu napisac takie cus udalo mi sie stworzyc (zbawienna byla metoda getElement)), funkcja dziala dla dowolnego obrazka [diabel]

oczywiscie zakladam ze max szerokosc i wysokosc jest ogolnie dla mnie znana (wiec jej nie obliczam :>
Tu przykladzik [cygaro] http://armet1.w.interia.pl/final.htm

A tu kod [niewinnosc]
[code]

<script language="javascript"> wskaznik=1; proces=0; function zmien(obiekt,co) { szerokosc=document.getElementById(obiekt).width; switch (co) { case 'p':{a=185;b=szerokosc;c=2;} break; default: {a=szerokosc;b=174;c=-2;} } if (a>b) { document.getElementById(obiekt).height+=c; document.getElementById(obiekt).width+=c; } else clearInterval(document.getElementById(obiekt).proces); } function p(obiekt,flaga,czas) { if (czas=="") czas=5; if (document.getElementById(obiekt).proces!=0) clearInterval(document.getElementById(obiekt).proces); document.getElementById(obiekt).proces=setInterval("zmien('"+obiekt+"','"+flaga+"')", czas) } </script> <body>

<img border="0" height="39" width="174" src="http://piechnat.iglu.cz/graf/logo.gif"
onmouseover="if (this.id=='') this.id='obrazek'+wskaznik++; p(this.id,'p',5);"
onmouseout="if (this.id=='') this.id='obrazek'+wskaznik++; p(this.id,'z',5);"

[/code]

0

Ładnie, chociaż wolę moją funkcję bo w twojej są dziwne wcięcia :p
Miałem problem, okazało się że zdarzenie onload jest wykonywane
w przypadku gifów animowanych za każdym przejściem animacji,
ale sobie poradziłem, no i id nadawany jest z losowej liczby,
więc nie trzeba w to mieszać zmiennej globalnej
przykład został wzbogacony i jest gotowy do sprzedaży ... ;-)

BTW to fajny pomysł z tymi obrazkami, chyba sobie na stronę wstawię...

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.