ugrás a tartalomhoz

Archívum - Május 15, 2017 - Fórum téma

Lenyíló szövegdobozok készítése

Dinnye · 2017. Május. 15. (H), 14.59
Sziasztok!

Abban szeretném a segítségeteket kérni, hogy hogyan készíthetnék lenyíló szövegdobozokat div-ből vagy table-ből valami egyszerű srcip-tel vagy minimal js-sel.

Egy nagyon primitív hírfolyamot szeretnék készíteni, ahol egymás alatt kinyitható szövegdobozok sorakoznának. Ebben a lenyíló részben lenne a tartalom. A lényeg, hogy ne csak egyetlen szövegdobozzal működjön, hanem bármennyivel.

Valami ilyesmire gondolok
  1. <script> function rejto(x)  
  2. {  
  3. if (document.getElementById("rejt"+x).style.display=="none")  
  4. {  
  5. document.getElementById("rejt"+x).style.display="block" document.getElementById("rejt"+x).style.visibility="visible"  
  6. }  
  7.   
  8. else  
  9. {  
  10. document.getElementById("rejt"+x).style.display="none" document.getElementById("rejt"+x).style.visibility="hidden"  
  11. }  
  12. }  
  13.   
  14. for(j=1;j<4;j++)  
  15. {  
  16. document.getElementById("rejt"+j).style.display="none" document.getElementById("rejt"+j).style.visibility="hidden"  
  17. }  
  18. </script>   
  19.   
  20. <table border="1" cellspacing="0" style="border-collapse: collapse" width="100%">       
  21.   
  22. <tr>  
  23. <td onclick="rejto(1)">1</td>    
  24. </tr>  
  25. <tr id="rejt1">  
  26. <td>1a</td>  
  27. </tr>  
  28.   
  29. <tr >  
  30. <td onclick="rejto(2)">2</td>  
  31. </tr>   <tr id="rejt2">  
  32. <td>2a</td>  
  33. </tr>  
  34.   
  35. <tr>  
  36. <td onclick="rejto(3)">3</td>  
  37. </tr>  
  38. <tr id="rejt3">  
  39. <td>3a</td>  
  40. </tr>  
  41.   
  42. </table>  
forrás: https://prog.hu/tudastar/18014/lenyilo-tablazat

Ez már majdnem az, amire én gondolok, csak annyi kellene hozzá, hogy a lenyíló dobozok alapból rejtve legyenek a lap betöltésekor, és csak kattintásra bukkanjanak elő, mert jelenleg alapból minden látszik és így túl terjedelmes.
A kinézettől most tekintsetek el. :)

Választok előre is köszönöm!
 ■