Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][JavaScript]jak zrobic pętle
Forum PHP.pl > Forum > Przedszkole
Mastersieciweb
8.11.2013, 12:32:33
witam, mam problem bo nie wiem jak zrobić pętle czy funkcje dzięki której nie musiałbym wypisywać po kolei moich obrazków tylko tak jakby to wszystko było klonowane tyle razy ile ja chce i funkcja onmouseover i onmouseout działała w każdym z osobno:) da sie tak?smile.gif 

[HTML] pobierz, plaintext 
  1. <html>
  2.  
  3. <head>
  4. <title>fgg</title>
  5. <body>
  6.  
  7. <img src="maggie.jpg" id="1">
  8. <img src="maggie.jpg" id="2">
  9. <img src="maggie.jpg" id="3">
  10. <img src="maggie.jpg" id="4">
  11. <img src="maggie.jpg" id="5">
  12.  
  13.  
  14.  
  15. <script>
  16. var nazwy = new Array('maggie.jpg', 'kate.jpg', 'roxana.jpg')
  17. var obr = [];
  18.  
  19. for (x=0; x<nazwy.length; x++) {
  20.  
  21. obr[x] = new Image();
  22.  
  23. obr[x].alt= nazwy[x];
  24.  
  25. }
  26.  
  27.  
  28.  
  29. document.getElementById('1').onmouseover = function() {
  30.  
  31. this.src = obr[1].alt;
  32.  
  33. }
  34.  
  35.  
  36. document.getElementById('1').onmouseout = function() {
  37.  
  38. this.src = obr[0].alt;
  39.  
  40. }
  41.  
  42. document.getElementById('2').onmouseover = function() {
  43.  
  44. this.src = obr[1].alt;
  45.  
  46. }
  47.  
  48.  
  49. document.getElementById('2').onmouseout = function() {
  50.  
  51. this.src = obr[0].alt;
  52.  
  53. }
  54.  
  55. document.getElementById('3').onmouseover = function() {
  56.  
  57. this.src = obr[1].alt;
  58.  
  59. }
  60.  
  61.  
  62. document.getElementById('3').onmouseout = function() {
  63.  
  64. this.src = obr[0].alt;
  65.  
  66. }
  67.  
  68. document.getElementById('4').onmouseover = function() {
  69.  
  70. this.src = obr[1].alt;
  71.  
  72. }
  73.  
  74.  
  75. document.getElementById('4').onmouseout = function() {
  76.  
  77. this.src = obr[0].alt;
  78.  
  79. }
  80.  
  81. document.getElementById('5').onmouseover = function() {
  82.  
  83. this.src = obr[1].alt;
  84.  
  85. }
  86.  
  87.  
  88. document.getElementById('5').onmouseout = function() {
  89.  
  90. this.src = obr[0].alt;
  91.  
  92. }
  93.  
  94. </script>
  95. </body>
  96. </html> 
[HTML] pobierz, plaintext
in5ane
8.11.2013, 12:39:34
Jak napisać poprawnie temat, nie tworząc trzech takich samych wątków? Takie pytanie powinieneś też zadać. A teraz do rzeczy:
[HTML] pobierz, plaintext 
  1. <html>
  2.  
  3. <head>
  4. <title>fgg</title>
  5. <body>
  6.  
  7. <img src="maggie.jpg" id="1">
  8. <img src="maggie.jpg" id="2">
  9. <img src="maggie.jpg" id="3">
  10. <img src="maggie.jpg" id="4">
  11. <img src="maggie.jpg" id="5">
  12.  
  13.  
  14.  
  15. <script>
  16. var nazwy = new Array('maggie.jpg', 'kate.jpg', 'roxana.jpg')
  17. var obr = [];
  18.  
  19. for (x=0; x<nazwy.length; x++) {
  20.  
  21. obr[x] = new Image();
  22.  
  23. obr[x].alt= nazwy[x];
  24.  
  25. }
  26.  
  27.  
  28.  
  29. <?php
  30. for($i = 1; $i <=5; $i++)
  31. {
  32. ?>
  33. document.getElementById('<?php echo $i; ?>').onmouseover = function() {
  34.  
  35. this.src = obr[1].alt;
  36.  
  37. }
  38.  
  39.  
  40. document.getElementById('<?php echo $i; ?>').onmouseout = function() {
  41.  
  42. this.src = obr[0].alt;
  43.  
  44. }
  45. <?php
  46. }
  47. ?>
  48.  
  49. </script>
  50. </body>
  51. </html> 
[HTML] pobierz, plaintext
Mastersieciweb
8.11.2013, 14:55:25
z jakiś nieznanych przyczyn nie działa mi ta funkcja.. a da sie to napisać w JS a nie PHP? jeśli chodzi o tematy które wstawiłem to tylko dlatego, że jak już ktoś odpisał w nim to nikt dalej nie kontynuował ze mną rozmowy na ten temat.. ludzie wchodzą tylko na te nowe tematy..
in5ane
8.11.2013, 17:01:59
A może ruszysz trochę głową? Mając pętlę w PHP, ciężko przerobić na JS, gdzie składnia jest identyczna? No takie pierdoły, to już można samemu i nawet, jakby Ci nie wychodziło, to za którymś razem by Ci wyszło, a ponadto chyba można w google sprawdzić, jak wygląda składni pętli for w w JS.
[HTML] pobierz, plaintext 
  1. <html>
  2.  
  3. <head>
  4. <title>fgg</title>
  5. <body>
  6.  
  7. <img src="maggie.jpg" id="1">
  8. <img src="maggie.jpg" id="2">
  9. <img src="maggie.jpg" id="3">
  10. <img src="maggie.jpg" id="4">
  11. <img src="maggie.jpg" id="5">
  12.  
  13.  
  14.  
  15. <script>
  16. var nazwy = new Array('maggie.jpg', 'kate.jpg', 'roxana.jpg')
  17. var obr = [];
  18.  
  19. for (x=0; x<nazwy.length; x++) {
  20.  
  21. obr[x] = new Image();
  22.  
  23. obr[x].alt= nazwy[x];
  24.  
  25. }
  26.  
  27.  
  28.  
  29. for (var i = 1; i <= 5; i++) {
  30.  
  31.  
  32. document.getElementById(i).onmouseover = function() {
  33.  
  34. this.src = obr[1].alt;
  35.  
  36. }
  37.  
  38.  
  39. document.getElementById(i).onmouseout = function() {
  40.  
  41. this.src = obr[0].alt;
  42.  
  43. }
  44.  
  45. }
  46. </script>
  47. </body>
  48. </html> 
[HTML] pobierz, plaintext
kamil4u
8.11.2013, 22:39:55
Warto dodać, że id nie może być liczbą.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.