Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][HTML]Zmiana kursora myszki po najechaniu na obrazek
kuba_pilach
post
Post #1





Grupa: Zarejestrowani
Postów: 224
Pomógł: 3
Dołączył: 24.12.2010

Ostrzeżenie: (0%)
-----


Witam!
Piszę mały kodzik na strone internetową. Chciałem zrobić interaktywną mapę. Ale mam problem, z zmienieniem kursora myszki... Oto mój kodzik:

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <title>Interaktywna mapa</title>
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  4. <script language="JavaScript">
  5. function point_it(event){
  6. pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
  7. pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
  8. document.getElementById("cross").style.left = (pos_x-9) ;
  9. document.getElementById("cross").style.top = (pos_y-9) ;
  10. document.getElementById("cross").style.visibility = "visible" ;
  11. document.pointform.form_x.value = pos_x;
  12. document.pointform.form_y.value = pos_y;
  13. }
  14.  
  15. function cursor_on(event) {
  16. this.style.cursor='crosshair';
  17. }
  18.  
  19. </head>
  20.  
  21. <form name="pointform" method="post">
  22. <div id="pointer_div" onmouseover="cursor_on(event)" onclick="point_it(event)" style = "background-image:url('images/mapa.jpg');width:1344px;height:1195px;">
  23. <img src="kropa.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;" width="20" height="20">
  24. </div>
  25. <br />
  26.  
  27. <br />Pozycja x = <input type="text" name="form_x" size="4" /> i y = <input type="text" name="form_y" size="4" />
  28. </form>
  29. </body>
  30. </html>


Wszystko bez próbowania zmienić kursora, działało dobrze, ale teraz się wszystko psuje...
Może ktoś pomóc?
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
kuba_pilach
post
Post #2





Grupa: Zarejestrowani
Postów: 224
Pomógł: 3
Dołączył: 24.12.2010

Ostrzeżenie: (0%)
-----


Nadal nie działa...
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <title>Interaktywna mapa</title>
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  4. <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
  5. <script language="JavaScript">
  6. function point_it(event){
  7. pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
  8. pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
  9. document.getElementById("cross").style.left = (pos_x-9) ;
  10. document.getElementById("cross").style.top = (pos_y-9) ;
  11. document.getElementById("cross").style.visibility = "visible" ;
  12. document.pointform.form_x.value = pos_x;
  13. document.pointform.form_y.value = pos_y;
  14.  
  15. }
  16.  
  17. <script type="text/javascript">
  18. $('#pointer_div').hover(function() {
  19. $(this).css('cursor', 'pointer');
  20. }, function() {
  21. $(this).css('cursor', 'crosshair');
  22. });
  23. </script>
  24. <!--<style type="text/css">
  25. #pointer_div {
  26. cursor: pointer;
  27. }
  28.  
  29. #pointer_div:hover {
  30. cursor: crosshair;
  31. }
  32. </style>!-->
  33. </head>
  34.  
  35. <form name="pointform" method="post">
  36. <div id="pointer_div" onclick="point_it(event)" style = "background-image:url('images/mapa.jpg');width:1344px;height:1195px;">
  37. <img src="kropa.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;" width="20" height="20">
  38. </div>
  39. <br />
  40.  
  41. <br />Pozycja x = <input type="text" name="form_x" size="4" /> i y = <input type="text" name="form_y" size="4" />
  42. </form>
  43. </body>
  44. </html>
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 8.10.2025 - 14:45