js funkcje i obsługa zdarzeń Opcje

[marcus753]

zastanawiam się nad tym jak z poziomu funkcji sprawdzić czy dane zdarzenie zostało wywołane a konkretniej:

onMouseUp="funkcja()" onMouseDown="funkcja();"

jak nacisnę klawisz myszy funkcja ma się uruchomić jak go puszczę funkcja ma się zakończyć jak coś takiego zrobić ? kombinuje czytam i guzik mi wyszedł ;/

[lord_t]

A co Ty chcesz osiagnąć? Co ta funkcja ma robić?

[marcus753]

najedziesz myszką na element wywołujesz funkcje funkcja np. coś tam liczy i po zjechaniu myszką z tego elementu funkcja przestaje liczyć.

co do liczenia może być to np. czas przez jaki kursor byl na danym elemencie...


Ten post edytował marcus753 21.04.2010, 17:33:27

[lord_t]

Skorzystaj z setInterval i clearInterval.

[marcus753]

ehh nie do końca o to mi chodziło podałeś mi funkcje zatrzymującą czas a mi chodziło o możliwość zatrzymania czasu podam go na konkretnym przykładzie:

mam taki skrypcik :

[HTML] pobierz, plaintext 
 
      <!-- presented by javascripts.pl -->
 
      <form name="Show">
 
      X <input type="text" name="MouseX" value="0" size="4"><br />
 
      Y <input type="text" name="MouseY" value="0" size="4"><br />
 
      </form>
       <script type='text/javascript'>
 
      <!--
 
      var IE = document.all?true:false;
 
      if (!IE) document.captureEvents(Event.MOUSEMOVE)
 
      document.onmousemove = getMouseXY;
 
      var tempX = 0;
 
      var tempY = 0;
 
      function getMouseXY(e) {
 
      if (IE) { // grab the x-y pos.s if browser is IE
 
      tempX = event.clientX + document.body.scrollLeft;
 
      tempY = event.clientY + document.body.scrollTop;
 
      }
 
      else { // grab the x-y pos.s if browser is NS
 
      tempX = e.pageX;
 
      tempY = e.pageY;
 
      }
 
      if (tempX < 0){tempX = 0;}
 
      if (tempY < 0){tempY = 0;}
 
      document.Show.MouseX.value = tempX;
 
      document.Show.MouseY.value = tempY;
 
      return true;
 
      }
 
      //-->
 
      </script>
 
      <!-- presented by javascripts.pl --><br />
      <br />
[HTML] pobierz, plaintext 

dopisałem sobie jeszcze taki kodzik:

[HTML] pobierz, plaintext 
<div style="width:100px;height:100px; overflow:hidden;"><div id="link1" onMouseUp="Obrazek();" onMouseDown="Obrazek();" style="margin-top:0px;margin-left:0px;  width:500px; height:500px;background-image:url(http://jakies_zdjecie.jpg)">c</div></div>
[HTML] pobierz, plaintext 

i jak klikne na zdjęcie wszystko się ładnie załącza problem w tym co mam zrobić aby jak puszcze klawisz myszy funkcje przestawały się dalej wykonywać ;/

chodziło mi o sam mechanizm takiego wyłączenia funkcji przez zdarzenie efekt ma byc podobny do tego z zumi.pl

Pozdrawiam i mam nadzieje że ktoś mi pomoże będę bardzo wdzięczny

[zegarek84]

dla pseudo kodu co podałeś wyżej przy zdarzeniu onmouseup wyczyść listenera na onmousemove (akurat tak jak robisz to np. przypisz pustą funkcję)

a najlepiej to daj przykład online gdyż w pseudokodzie javascript nie ma funkcji obrazek() a niżej na mousedown i up odwołujesz się do tej funkcji...

[marcus753]

Wybacz, zjadło mi jedna linijke...

link ze skryptem nad ktorym pracuje -->http://www.marcus.osa.pl/js2.html

jak kilkam to sie przesowa chcialbym ze jak puszcze klawisz to sie zatrzymuje i nie mam pojecia jak to zrobic !?

[zegarek84]

niestety wczoraj bylem w pracy... ale po zatym pisałem co zrobić (akurat tu element masz wewnątrz innego i działało tylko puki myszką nie wyjechałeś poza obszar - co mogło dać Ci coś do myślenia ;p)...

i zamiast podpinać zdarzenia tak jak podpinasz poczytaj o addEventListener...

źródła nawet Ci się nie chciało sformatować o i ja nie formatowałem (na szybko zmieniłem w operze i masz gotowca - na przyszłość pomyśl )

a i pytanie czy to jest poprawny html?? ;p [za Ciebie nie będę pisał początku, końca i innych ;p

[HTML] pobierz, plaintext 
<!-- presented by javascripts.pl -->
<form name="Show">
X <input type="text" name="MouseX" value="0" size="4"><br />
Y <input type="text" name="MouseY" value="0" size="4"><br />
</form>
 
<script type='text/javascript'>
<!--
c=0;
d=0;
function stop(){
document.onmousemove=null;
document.onmouseup=null;
}
 
function Obrazek(){
document.onmouseup=stop;
var IE = document.all?true:false; 
if (!IE) document.captureEvents(Event.MOUSEMOVE) 
document.onmousemove = getMouseXY; 
var tempX = 0; 
var tempY = 0; 
function getMouseXY(e) { 
if (IE) { // grab the x-y pos.s if browser is IE 
tempX = event.clientX + document.body.scrollLeft; 
tempY = event.clientY + document.body.scrollTop; 
} 
else { // grab the x-y pos.s if browser is NS 
tempX = e.pageX; 
tempY = e.pageY; 
} 
if (tempX < 0){tempX = 0;} 
if (tempY < 0){tempY = 0;} 
document.Show.MouseX.value = tempX; 
document.Show.MouseY.value = tempY; 
if(c==0){
c=tempY;
}
 
if(d==0){
d=tempX;
}
document.getElementById('link1').style.marginTop = (tempY-c);
document.getElementById('link1').style.marginLeft = (tempX-d);
document.getElementById('link').style.marginTop = (tempY-c);
document.getElementById('link').style.marginLeft = (tempX-d);
 
return true; 
}}
//-->
</script>
<!-- presented by javascripts.pl --><br />
<div id="javascriptspl" align="center"><a href="http://www.javascripts.pl/javascript.html" title="Darmowe Java Skrypty" target="_blank">Darmowe Java Script</a></div>
<br />
 
<!-- <div style="width:100px; margin:0px; height:100px; background-color:red;"  onclick="Obrazek();"
    id="link">wiecej</div>-->
 
		<div style="width:100px;height:100px; overflow:hidden;"><div id="link1" onmousedown="Obrazek();" style="margin-top:0px;margin-left:0px;  width:500px; height:500px;background-image:url(http://photos.hotele.pl/krakow_qubus_hotel_krakow_1_3.jpg)">c</div></div>dsf
[HTML] pobierz, plaintext 

Ten post edytował zegarek84 23.04.2010, 10:05:43