• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Galeria zdjęć - JavaScript

VPS Starter Arubacloud
0 głosów
636 wizyt
pytanie zadane 20 października 2016 w JavaScript przez hiper007 Stary wyjadacz (11,270 p.)
zamknięte 22 października 2016 przez hiper007
  <script>	
   function ustaw(nr)
 {
				
				var numer=nr;
				var plik="<img src=\"img/scr"+nr+".jpg\"/>"; 
				document.getElementById("zmien2").innerHTML=plik;
 }
  
  
 function dodaj()
 {
				var numer=1;
				var plik="<img src=\"img/scr"+numer+".jpg\"/>"; 
				document.getElementById("zmien2").innerHTML=plik;
 }

 function left()
 {
				numer=numer-1; if(numer<1) numer=16;
				var plik="<img src=\"img/scr"+numer+".jpg\"/>"; 
				document.getElementById("zmien2").innerHTML=plik;
 }

 function right()
 {
				numer=numer+1; if(numer>16) numer=1;
				var plik="<img src=\"img/scr"+numer+".jpg\"/>"; 
				document.getElementById("zmien2").innerHTML=plik;
 }
 </script>	

Tag body

<body onload="dodaj();">

Miejsce wyswietlania zdjęć

<div id="lewy2"><i  onclick="left();" class="icon-left-circled klasadruga"></i></div><div id="zmien2"></div><div id="prawy2"><i onclick="right();" class="icon-right-circled klasadruga"></i></div>
		 

Kod odpowiedzialny za ustawienie zdjecia  w div zmien2

		<table align="center" cellpadding="20">
		
		<tr><td><span onclick="ustaw(1);" style="cursor:pointer;"><img class="ramka" src="img/sc1.jpg" border="0"></span></td><td><span onclick="ustaw(2);" style="cursor:pointer;"><img class="ramka" src="img/sc2.jpg"  border="0"></span></td><td><span onclick="ustaw(3);" style="cursor:pointer;"><img class="ramka" src="img/sc3.jpg" border="0"></span></td><td><span onclick="ustaw(4);" style="cursor:pointer;"><img class="ramka" src="img/sc4.jpg" border="0"></span></td></tr>
		<tr><td><span onclick="ustaw(5);" style="cursor:pointer;"><img class="ramka" src="img/sc5.jpg" border="0"></span></td><td><span onclick="ustaw(6);" style="cursor:pointer;"><img class="ramka" src="img/sc6.jpg" border="0"></span></td><td><span onclick="ustaw(7);" style="cursor:pointer;"><img class="ramka" src="img/sc7.jpg" border="0"></span></td><td><span onclick="ustaw(8);" style="cursor:pointer;"><img class="ramka" src="img/sc8.jpg" border="0"></span></td></tr>
		<tr><td><span onclick="ustaw(9);" style="cursor:pointer;"><img class="ramka" src="img/sc9.jpg" border="0"></span></td><td><span onclick="ustaw(10);" style="cursor:pointer;"><img class="ramka" src="img/sc10.jpg" border="0"></span></td><td><span onclick="ustaw(11);" style="cursor:pointer;"><img class="ramka" src="img/sc11.jpg" border="0"></span></td><td><span onclick="ustaw(12);" style="cursor:pointer;"><img class="ramka" src="img/sc12.jpg" border="0"></span></td></tr>
		<tr><td><span onclick="ustaw(13);" style="cursor:pointer;"><img class="ramka" src="img/sc13.jpg" border="0"></span></td><td><span onclick="ustaw(14);" style="cursor:pointer;"><img class="ramka" src="img/sc14.jpg" border="0"></span></td><td><span onclick="ustaw(15);" style="cursor:pointer;"><img class="ramka" src="img/sc15.jpg" border="0"></span></td><td><span onclick="ustaw(16);" style="cursor:pointer;"><img class="ramka" src="img/sc16.jpg" border="0"></span></td></tr>
		
		</table>

Pytanko

Wchodze na strone pojawia misie w okienku obrazek scr1.jpg w divie zmien2 klikam na obrazek scr5.jpg i pojawia mi sie w divie zmien2 obrazek scr5.jpg tylko po tym jak klikne w strzałkę w prawo jako kolejny obrazek pojawia mi sie obrazek scr2.jpg zamiast scr6.jpg. Gdzie trzeba zmodyfikować kod zeby pamietał numer obrazka nastepny po kliknieciu.

Obrazki ida od scr1.jpg go scr16.jpg.

 

komentarz zamknięcia: Problem rozwiązany

1 odpowiedź

+1 głos
odpowiedź 20 października 2016 przez Przemek Zembrzuski Gaduła (3,240 p.)
wybrane 22 października 2016 przez hiper007
 
Najlepsza
Spróbuj pobrać za pomocą childNode jaki aktualnie obrazek znajduje się w rodzicu
komentarz 20 października 2016 przez hiper007 Stary wyjadacz (11,270 p.)
A mógłbyś mi szepnął troszkę więcej na ten temat ;) bo nie korzystałem z tego jeszcze i niebardzo wiem... Co masz na myśli
komentarz 20 października 2016 przez Przemek Zembrzuski Gaduła (3,240 p.)
Ustawiasz zmienną do której zapisujesz childNodes rodzica, czyli jakie dzieci posiada rodzic i w taki sposób masz zapisane jaki aktualnie obrazek jest wyświetlony. Masz jeszcze link: http://www.w3schools.com/jsref/prop_node_childnodes.asp

np.

var aktualnyObrazek = parent.childNodes;
komentarz 22 października 2016 przez hiper007 Stary wyjadacz (11,270 p.)
Wystarczyło w funkcji ustaw() usunac deklaracje zmiennej var ;) i problem rozwiązany zmienna numer była deklarowaną dwa razy ;)

Podobne pytania

+2 głosów
1 odpowiedź 238 wizyt
0 głosów
1 odpowiedź 177 wizyt
pytanie zadane 29 grudnia 2015 w JavaScript przez Piotrek Karasiński Obywatel (1,870 p.)
+1 głos
1 odpowiedź 380 wizyt
pytanie zadane 8 maja 2018 w JavaScript przez Kacper Borszcz Początkujący (260 p.)

92,453 zapytań

141,262 odpowiedzi

319,086 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...