Подскажите, пожалуйста, как сделать аккордеон подобного плана, в тупик ставит не только код для javascript, но и что писать в html и css тоже не понимаю
function toogle(e) {
var elems = document.getElementsByClassName('test');
for (var i = 0; i < elems.length; i += 1) {
elems[i].childNodes[3].style.display = 'none';
}
e.childNodes[3].style.display = 'block';
}
div.test {
width: 300px;
margin-bottom: 5px;
border: 1px solid #cccccc;
}
div.test>.header {
padding: 5px;
height: 40px;
line-height: 40px;
background-color: #cccccc;
}
div.test>.text {
display:none;
padding: 5px;
height: 70px;
line-height: 70px;
background-color: #f2f2f2;
}
<div class="test" onclick="toogle(this)">
<div class="header">test</div>
<div class="text">test1 test1 test1 test1 test1</div>
</div>
<div class="test" onclick="toogle(this)">
<div class="header">test</div>
<div class="text">test2 test2 test2 test2 test2</div>
</div>
<div class="test" onclick="toogle(this)">
<div class="header">test</div>
<div class="text">test3 test3 test3 test3 test3</div>
</div>
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Есть фиксированная шапкаПри прокручивании сайта лого должно применять цвет фона, на котором оно находится
Есть адаптивный сайт на bootstrapНа некоторых страницах футер "подпрыгивает" вверх