Здравсвуйте!
Хочу реализовать выпадающие блоки.
Написал вот такой вот скрипт
<script>
$(document).ready(function(){
// Если пользователь кликнул на секцию
$('li > .but').click(function()
{
// Сбрасываем все секции
$('li > .block').hide();
// Делаем активной на которую кликнули
$(this).addClass('active');
$(this).next().addClass('active').show();
});
});
</script>
|
Код:
|
<style type="text/css">
ul {
}
ul li {
display:inline;
position:relative;
}
.block {
position:absolute;
display:none;
}
</style> |
<ul>
<li>asdasd <span class="but">V</span><div class="block">1</div></li>
<li>asdasd <span class="but">V</span><div class="block">2</div></li>
<li>asdasd <span class="but">V</span><div class="block">3</div></li>
</ul>
Всё вроде-бы работает, но есть один минус, не хватает функции toggle. Как не крутил, так и не понял куда её применить.
- Блок открываеться по клику на елемент .but, если были открыт другие они закрваються и открываеться по которому был произведён клик.
- Нехватает функции toggle как её применить в данном примере? Я что-то не совсем понимаю.
Пример можно посмотреть на том-же _vbank.ru, нет ну можно конечно у них свиснуть код)) Но хотелось бы самому разобраться.
Спасибо.
