Logowanie

wyświetlanie kolejno divów

pytanie zadane 3 grudnia 2017 w JavaScript przez gunaterek Bywalec (2,760 p.)
zamknięte 3 grudnia 2017 przez gunaterek

Czy da sie przerobic tak ten skrypt zeby po wcisnieciu show wyswietlil sie 1 div i za kazdym razem zeby wyswietlał sie kolejny i zeby sie dalo tez je chowac pojedynczo ? daze do tego zeby dalo sie przewijac np artykuly. chyba ze jest jakas lepsza funkcja do tego .Od razu mowie jestem poczatkujacy i javy jeszcze nie poznalem dlatego pytam bo walcze z tym i walcze.

https://codepen.io/anon/pen/xPMQYj

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>show demo</title>
  <style>
  div {
    background: #def3ca;
    margin: 3px;
    width: 80px;
    display: none;
    float: left;
    text-align: center;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<button id="showr">Show</button>
<button id="hidr">Hide</button>
<div>Hello 3,</div>
<div>how</div>
<div>are</div>
<div>you?</div>
 
<script>
$( "#showr" ).click(function() {
  $( "div" ).first().show( "fast", function showNext() {
    $( this ).next( "div" ).show( "fast", showNext );
  });
});
 
$( "#hidr" ).click(function() {
  $( "div" ).hide( 1000 );
});
</script>
 
</body>
</html>

pozdrawiam

komentarz zamknięcia: rozwiazany problem

1 odpowiedź

odpowiedź 3 grudnia 2017 przez Chess Szeryf (76,710 p.)
wybrane 3 grudnia 2017 przez gunaterek

Najlepsza

.myclass{ 
	background:green;
	width:200px;
	height:10px;
	margin-top:5px;
}

<body style="background:grey">


<div class="myclass" style="display:none">0</div>
<div class="myclass"  style="display:none">1</div>
<div class="myclass"  style="display:none">2</div>
<div class="myclass" style="display:none">3</div>
<div class="myclass" style="display:none">4</div>
<div class="myclass" style="display:none">5</div>

<button id="btn">click</button>
<button id="btn2">click2</button>

<script src="my_script_js.js"></script>

</body>

var get_elements = document.querySelectorAll('.myclass');

var btn = document.getElementById('btn');
var btn2 = document.getElementById('btn2');

var i=0;
function shows(){ 
	 
	get_elements[i].style.display = 'block';
	
	if(i>=get_elements.length-1){
		null;
	}else{ 
		i++;
	}
}
 
function hides(){ 

	 get_elements[i].style.display = 'none';
	 
	 if(i<=0){
	 	null;
	 }else{ 
		i--;
	 }
	
}


btn.addEventListener('click',shows,false);
btn2.addEventListener('click',hides,false);

Podobne pytania

0 głosów

1 odpowiedź 1,550 wizyt

jquery - ukrywanie i wyświetlanie

pytanie zadane 13 października 2017 w JavaScript przez adrian588 Początkujący (470 p.)

0 głosów

1 odpowiedź 111 wizyt

.show diva strony Parent z poziomu Child [jQuery]

pytanie zadane 18 października 2018 w JavaScript przez Oskar Szkurłat Bywalec (2,780 p.)

+1 głos

2 odpowiedzi 467 wizyt

Wywołanie funkcji show() tylko raz

pytanie zadane 2 lipca 2018 w JavaScript przez fyrr Użytkownik (910 p.)

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

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!

...

wyświetlanie kolejno divów

Zaloguj lub zarejestruj się, aby skomentować.

1 odpowiedź

Zaloguj lub zarejestruj się, aby skomentować.

Podobne pytania

O działaniu forum

Pasja informatyki w internecie

Polecane miejsca w sieci