 wylaczenie funkcji, problem z clearInterval() |
| wylaczenie funkcji, problem z clearInterval() |
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 110 Pomógł: 3 Dołączył: 12.03.2011 Skąd: Opole Ostrzeżenie: (0%) 
 |
witam ,mam problem ze skryptem zmiany stylu css, napisalem funkcje zmieniajaca plynnie dana wartosc stylu do podanego parametru,zainicjowanie nastepuje przez zdarzenie onmouseover a onmouseout ma za zadanie wyzerowac timer wczesniejszy i plynnie przywrocic parametr stylu,i tu wlasnie jest problem ..prosze o pomoc...(z js wlasnie zaczynam)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Dokument bez tytułu</title> <script type="text/javascript"> function start(obj,wartosc,styll){ if (obj.currentStyle){ var s=obj.currentStyle[styll]; var od=parseInt(s); } else { var w=window.getComputedStyle(obj, null)[styll]; var od=parseFloat(w); } clearInterval(); setInterval(run,15); function run(){ if(od<wartosc){ ++od; } else if (od>wartosc){ --od; } else { clearInterval(); } obj.style[styll]=od+'px'; } } </script> <style type="text/css"> div { background-color: #069; height: 40px; width: 40px; float:left; margin:5px; } </style> </head> <body> <div onmouseover="start(this,'200','height');" onmouseout="start(this,'40','height');"></div> <div onmouseover="start(this,'200','height');" onmouseout="start(this,'40','height');"></div> <div onmouseover="start(this,'200','height');" onmouseout="start(this,'40','height');"></div> </body> </html> |
 |
 
|
 |
|
Post
#2
|
|
|
Grupa: Zarejestrowani Postów: 561 Pomógł: 72 Dołączył: 15.11.2006 Ostrzeżenie: (0%)
|
|
|
|
|
|
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 110 Pomógł: 3 Dołączył: 12.03.2011 Skąd: Opole Ostrzeżenie: (0%)
|
Kod clearInterval(w); var w=setInterval(run,15); function run(){ if(od<wartosc){ ++od; } else if (od>wartosc){ --od; } else { clearInterval(w); } po poprawkach dalej nie dziala |
|
|
|
|
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 561 Pomógł: 72 Dołączył: 15.11.2006 Ostrzeżenie: (0%)
|
Przecież 'w' to normalna zmienna, jak chcesz się do niej odwołać przed jej zainicjowaniem ? Najpierw robisz clearInterval(w) na zmiennej którą tworzysz dopiero w kolejnej linijce -> gdzie tu sens ? (IMG:style_emoticons/default/smile.gif) Tak myślałem, że przekleisz kod i nawet nie pomyślisz (IMG:style_emoticons/default/wink.gif) W twoim przypadku musiałbyś tą zmienną 'w' inicjować na początku kodu jako zmienną globalną. Da się to oczywiście zrobić bez zmiennej globalnej ale musiałbyś przepisać cały kod (IMG:style_emoticons/default/wink.gif)
|
|
|
|
|
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 110 Pomógł: 3 Dołączył: 12.03.2011 Skąd: Opole Ostrzeżenie: (0%)
|
Zgadza sie jednak samo zainicjonowanie zmiennej nie wystarczy ,chce wylaczyc wczesniejsze odpalenie timera w chwili wlaczenia powtornego na tym samym obiekcie
|
|
|
|
|
Post
#6
|
|
|
Grupa: Zarejestrowani Postów: 561 Pomógł: 72 Dołączył: 15.11.2006 Ostrzeżenie: (0%)
|
Przy inicjacji ustawiaj w = null;
Przy pierwszym pierwszym wywołaniu clearInterval sprawdzaj czy w == null, jeśli nie to czyść, jeśli tak to nie rób nic. Trzeba trochę pomyśleć. |
|
|
|
|
Post
#7
|
|
|
Grupa: Zarejestrowani Postów: 110 Pomógł: 3 Dołączył: 12.03.2011 Skąd: Opole Ostrzeżenie: (0%)
|
poradzilem sobie,ale uwagi (propozycje zmian w celu zwiekszenia poprawności i wydajności) mile widziane
CODE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Dokument bez tytułu</title> <script type="text/javascript"> function animuj(obiekt,docelowa,styll,poczatkowa){ if (typeof obiekt.currentStyle!=='undefined'){ var obecna=parseFloat(obiekt.currentStyle[styll]);} else { var obecna=parseFloat(window.getComputedStyle(obiekt, null)[styll]);} function up(){ var timer=setInterval(function (){ if (obecna<docelowa){obecna+=2} else if (obecna>docelowa){obecna-=2} else {clearInterval(timer);} obiekt.style[styll]=obecna+'px'; },15); obiekt.onmouseout = function(){ clearInterval(timer); docelowa=poczatkowa; up();} } up(); } </script> <style type="text/css"> div { background-color: #069; height: 40px; width: 40px; float:left; margin:5px; } </style> </head> <body> <div onmouseover="animuj(this,'200','height','40');" ></div> <div onmouseover="animuj(this,'200','height','40');" ></div> </body> </html> |
|
|
|
 |
|
Aktualny czas: 21.09.2025 - 17:30 |
