HTML-ben egy div-re kattintva "lenyíló" panel készítése?
Az ötlet röviden: az oldal szerkezete valami olyasmi lenne, hogy címszavak egymás alatt külön-külön div-ben, és a div-re kattintva lenyílik alatta az adott cím tartalma
itt egy kép is: [link]
Az értelmes válaszokat előre is köszönöm
ezen már el tudsz indulni
sajna még kezdő vagyok js téren :/
Szóval, ha meg tudnátok mondani mit rontottam el ebben hálás lennék
(1.-es alapján csináltam)
<html>
<body>
<script type="text/x-javascript">
$(document).ready(function () {
$('.accordion-item .title').on('click', function () {
$(this).siblings('div.accordion-content').slideToggle();
})
})
</script>
<style>
.accordion-item .title {
cursor: pointer;
}
.accordion-item .accordion-content {
display: none;
}
</style>
<div class="accordion-item">
<p class="title">Kérdés #1</p>
<div class="accordion-content">
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
</div>
</div>
<div class="accordion-item">
<p class="title">Kérdés #1</p>
<div class="accordion-content">
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
</div>
</div>
<div class="accordion-item">
<p class="title">Kérdés #1</p>
<div class="accordion-content">
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
</div>
</div>
<div class="accordion-item">
<p class="title">Kérdés #1</p>
<div class="accordion-content">
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
</div>
</div>
<div class="accordion-item">
<p class="title">Kérdés #1</p>
<div class="accordion-content">
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
<p>Válasz</p>
</div>
</div>
</body>
</html>
Ja igen, annyi a gond, hogy amit én küldtem az egy jQuery nevű függvénykönyvtárat használ.
A <head></head> tagbe rakd be ezt, és ez be fogja tölteni:
<script src=" [link]
Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!