Python týden Geek tričko zdarma
Tričko zdarma! Stačí před dobitím bodů použít kód TRIKO15. Více informací zde
Pouze tento sleva až 80% na kurzy Python

Diskuze: Špecificky toggle

Aktivity (2)
Avatar
Mego
Člen
Avatar
Mego:7. ledna 6:23

b

Zkusil jsem: a

Chci docílit: Ahojte, vedel by mi takto na ráno dajaky javascriptak poradiť?
Mám list so 6 položkami <li>, ale môže ich byť aj viac ako 6 - ľubovoľný počet, 6 je minimum. Každá má classu "event". Pod tým celým mám button s classou dajme tomu "toggle-btn".
Potrebujem urobiť taký toggle, ktorý by mi zo 6 položiek zobrazil len 3 a zbytné položky až po kliknutí na button a tiež by sa po ďalšom kliknutí zasa schovali. Problém je, že nemôžem absolútne pristúpiť na úpravu html, inač by som si tie tri dal do špeci divka a zvladol by som to aj so svojimi chabými JS schopnosťami. No a ten button sa nachádza tiež dosť mimo toho <ul>, čo sa kódu týka (čo sa týka stránky, tak je hneď pod tým listom samozrejme, ale končí tam a začínajú nové divka a sections atď.)
Ďakujem za každú pomoc

Odpovědět 7. ledna 6:23
Radšej 15 minút skôr, ako 15 sekúnd neskoro...
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:7. ledna 10:15

Idealni by bylo dat tomu class. Pak bys u celeho divu jen menil class.

zobraz1 nebo zobraz2
-item
-item
-item
-item hidden

zobraz1 li {block}
zobraz1 li.hidden {none}
zobraz2 li {block}
zobraz2 li.hidden {block}

js...

x = {};
x.bool = false;
x.toggle = function()
  {
  var i, i_end, el;
  el = document.querySelectorAll('UL LI');
  i_end = el.length;
  for(i=2; i<i_end; i++) {el.style.className = x.bool ? 'show' : 'hide';}
  x.bool = !x.bool;
  }
x.toggle();
// <input type="button" onclick="x.toggle();">
Editováno 7. ledna 10:16
 
Nahoru Odpovědět  +1 7. ledna 10:15
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.