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

Jak poprawić slider z odcinka 2 JS

0 głosów
132 wizyt
pytanie zadane 29 sierpnia 2016 w JavaScript, jQuery, AJAX przez dartespl Użytkownik (830 p.)

Witam was serdecznie :P
 Jestem początkujący w programowaniu w JS i chciałbym wiedzieć, jak można poprawić slider  z 2 odcinku JS u pana Mirosława. Na końcu odcinku powiedział, że slider nie jest idealny. Zauważyłem, że jak klikam bardzo szybko na te numerki, to slider "szaleje", czyli bardzo szybko zmienia slajdy.

Pomyślałem, że można podczas FadeIn i FadeOut uniemożliwić zmianę slajdu. Poklepałem w klawiaturę, pomyślałem, ale dalej nie działa, dlatego proszę was na forum o pomoc. Jestem totalnym newbie w JS, więc proszę o wyrozumiałość :P Poniżej macie kod, który mi nie działa.

 

<!DOCTYPE html>
<html lang="pl">
<html>
	<head>
		<meta charset="utf-8" />
		
		<style>
			body
			{
				background-color: #222222;
				font-size: 24px;
				color: white;
			}
		</style>
		
		<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
		
		<script type="text/javascript">
		
			var numer = Math.floor(Math.random()*5)+1;
			
			var timer1 = 0;
			var timer2 = 0;
			var sprawdz=true;
			
			function zmiana()
			{
				sprawdz=true;
			}
			
			function ustawslajd(nrslajdu)
			{
			if(sprawdz==true)
				{
					clearTimeout(timer1);
					clearTimeout(timer2);
					numer = nrslajdu - 1;
					
					schowaj();
					setTimeout("zmienslajd()", 500);
				}	
			}
			
			function schowaj()
			{
				sprawdz=false; setTimeout("zmiana()", 500);
				$("#slider").fadeOut(500);
			}
		
			function zmienslajd()
			{
				numer++; if (numer>5) numer=1;
				
				var plik = "<img src=\"slajdy/slajd" + numer + ".png\" />";
				
				document.getElementById("slider").innerHTML = plik;
				sprawdz=false; setTimeout("zmiana()", 500);
				$("#slider").fadeIn(500);
				
				timer1 = setTimeout("zmienslajd()", 5000);
				timer2 = setTimeout("schowaj()", 4500);
			
			}
			
		</script>
		
	</head>
	<body onload="zmienslajd()">
	
		<span onclick="ustawslajd(1)" style="cursor:pointer;">[ 1 ]</span>
		<span onclick="ustawslajd(2)" style="cursor:pointer;">[ 2 ]</span>
		<span onclick="ustawslajd(3)" style="cursor:pointer;">[ 3 ]</span>
		<span onclick="ustawslajd(4)" style="cursor:pointer;">[ 4 ]</span>
		<span onclick="ustawslajd(5)" style="cursor:pointer;">[ 5 ]</span>
		
		<div id="slider"></div>
		
	</body>
</html>

 

komentarz 30 sierpnia 2016 przez EDiox Nowicjusz (100 p.)
Przydało by się chociaż troszkę komentarza, co autor miał na myśli. Po co ten setTimeout w funkcji schowaj() i dodatkowo w zmienslajd(). Ciężko coś poradzić. Czy semafory mają tu sens?

1 odpowiedź

0 głosów
odpowiedź 29 sierpnia 2016 przez xmentor Nałogowiec (49,900 p.)
komentarz 29 sierpnia 2016 przez dartespl Użytkownik (830 p.)
Ten też cierpi na tą dolegliwość, a poza tym, to jest ten sam kod, jaki jest na stronie Mirosława Zelenta.
2
komentarz 29 sierpnia 2016 przez xmentor Nałogowiec (49,900 p.)

Są tam jeszcze inne branche niż master ;)

Podobne pytania

–1 głos
1 odpowiedź 128 wizyt
0 głosów
3 odpowiedzi 104 wizyt
pytanie zadane 27 lipca 2016 w PHP, Symfony, Zend przez owolcz Początkujący (340 p.)
0 głosów
1 odpowiedź 130 wizyt
Porady nie od parady
Komentarze do pytań nie służą do odpowiadania, od tego jest wydzielona sekcja odpowiedzi. Funkcją komentarzy jest natomiast możliwość uzyskania dodatkowych informacji na temat samego posta.Komentarze

66,384 zapytań

113,137 odpowiedzi

239,497 komentarzy

46,641 pasjonatów

Przeglądających: 295
Pasjonatów: 2 Gości: 293

Motyw:

Akcja Pajacyk

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

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...