Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][JavaScript]jak zrobic pętle, jak zrobić pętle
Mastersieciweb
post 8.11.2013, 12:32:33
Post #1





Grupa: Zarejestrowani
Postów: 84
Pomógł: 0
Dołączył: 14.10.2013

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

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
Go to the top of the page
+Quote Post
in5ane
post 8.11.2013, 12:39:34
Post #2





Grupa: Zarejestrowani
Postów: 1 335
Pomógł: 34
Dołączył: 9.11.2005
Skąd: Wrocław

Ostrzeżenie: (10%)
X----

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


Ten post edytował in5ane 8.11.2013, 12:39:52


--------------------
> > > Tworzenie stron < < <
Go to the top of the page
+Quote Post
Mastersieciweb
post 8.11.2013, 14:55:25
Post #3





Grupa: Zarejestrowani
Postów: 84
Pomógł: 0
Dołączył: 14.10.2013

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

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..
Go to the top of the page
+Quote Post
in5ane
post 8.11.2013, 17:01:59
Post #4





Grupa: Zarejestrowani
Postów: 1 335
Pomógł: 34
Dołączył: 9.11.2005
Skąd: Wrocław

Ostrzeżenie: (10%)
X----

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


--------------------
> > > Tworzenie stron < < <
Go to the top of the page
+Quote Post
kamil4u
post 8.11.2013, 22:39:55
Post #5





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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

Warto dodać, że id nie może być liczbą.


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 12.06.2025 - 22:45
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn