Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Jak pod jeden link podpiąć skrypt, który po każdorazowym kliknięciu wywoła kolejnego div'a?
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
marcus755
Hej wszystkim,

zrobiłem coś takiego:

<div id="bloki" style="display:block;">
<div id="blok_1" style="width:200px; height:100px;">Lorem ipsum 1</div>
<div id="blok_1" style="width:200px; height:100px;">Lorem ipsum 2</div>
<div id="blok_1" style="width:200px; height:100px;">Lorem ipsum 3</div>
<div id="blok_1" style="width:200px; height:100px;">Lorem ipsum 4</div>
</div>

<div id="bloki2" style="display:none;">
<div id="bloki_2" style="width:200px; height:100px;">Lorem ipsum 11</div>
<div id="bloki_2" style="width:200px; height:100px;">Lorem ipsum 21</div>
<div id="bloki_2" style="width:200px; height:100px;">Lorem ipsum 31</div>
<div id="bloki_2" style="width:200px; height:100px;">Lorem ipsum 41</div>
</div>

<div id="bloki3" style="display:none;">
<div id="blok_3" style="width:200px; height:100px;">Lorem ipsum 110</div>
<div id="blok_3" style="width:200px; height:100px;">Lorem ipsum 210</div>
<div id="blok_3" style="width:200px; height:100px;">Lorem ipsum 310</div>
<div id="blok_3" style="width:200px; height:100px;">Lorem ipsum 410</div>
</div>

<a id="next" class="next" href="#">next div</a>

<script>
$(document).ready(function() {
$('#next').click(function(){
$('div#bloki2:hidden').fadeIn();
});
});
</script>

Jak zrobić, żeby jak kliknę jeszcze raz w ten sam link,
wywołał mi id="bloki3" ?
mokry
Każdemu z div'ów nadajesz jakąś klasę (np. .toShow).
Następnie, po kliknięciu na #next lecisz za pomocą each() po każdym divie z klasą .toShow i sprawdzasz czy display jest ustawiony na none, jeśli tak, dajesz fadeIn() na nim i przerywasz skrypt (return false;).

Tu masz rozwiązanie na szybko:
http://jsfiddle.net/9bD8m/2/

Przy okazji zamiast powtarzać za każdym razem style w divach, zdefiniuj jedną klasę i przypisz ją każdemu z osobna. Lub jeszcze lepiej, zdefiniuj w CSS "div.toShow div {}" i możesz ominąć jakiekolwiek style i klasy w tych divach w środku.
Pamiętaj też o tym, że atrybut id dla jakiegokolwiek elementu musi być unikalny w całym dokumencie, zatem zmień sobie u siebie te powtarzające się id wink.gif.
cfk
spróbuj skorzystać z czegoś takiego

  1. //pierwsze klikniecie
  2. document.getElementById('blok2').style.display=='block';
  3.  
  4. //kazde kolejne
  5. if ((document.getElementById('blok2').style.display=='block')
  6. {
  7. document.getElementById('blok3).style.display='block';
  8. }

napisz to jako funkcje i podłącz na onclick
marcus755
Wielkie Dzięki za pomoc:-)
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.