NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
Lava
Člen
Avatar
Lava:7.1.2019 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.1.2019 6:23
Aspartám, sacharín, to je môj vitamín
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:7.1.2019 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.1.2019 10:16
 
Nahoru Odpovědět
7.1.2019 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.