#jquery #navigation #wikipedia
#jquery #навигация #википедия
Вопрос:
я хочу воспроизвести меню в левой части википедии
существует ли какой-либо плагин jquery, который выполняет развертывание и сворачивание, или я должен написать его с нуля?
В частности, я хочу, чтобы отображались стрелки вправо и вниз, указывающие на то, что это интерактивное меню
Комментарии:
Ответ №1:
$('selector').slideToggle('fast');
Смотрите документацию jQuery для получения дополнительной информации: http://docs.jquery.com/Main_Page
Попробуйте это:
<div class="title">Title</div>
<div>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</div>
<div class="title">Title</div>
<div>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</div>
Стили:
.title
{
padding-left:10px;
background-image: url("ui/right_arrow.png") no-repeat;
}
.title.selected
{
background-image: url("ui/down_arrow.png") no-repeat;
}
И ваш jQuery:
$('.title').live('click', function ()
{
$(this).toggleClass('selected');
$(this).next().slideToggle('fast');
});
Комментарии:
1. Спасибо. . как бы мне получить стрелки вправо и вниз, как у них есть в ВИКИпедии, чтобы было понятно, что вы можете нажать на ссылку
2. Вы можете использовать фоновое изображение в divs с классом «title» и использовать отступ слева: 10 пикселей или около того, чтобы отодвинуть текст от изображения, чтобы текст не располагался поверх изображения. Затем вы можете использовать метод «toggleClass» в jQuery для добавления / удаления «выбранного» класса. Выбранный класс может переопределить фоновое изображение заголовка и отобразить другое изображение. Дайте мне знать, если хотите пример.
Ответ №2:
Используйте виджет accordion в пользовательском интерфейсе jQuery и оформите его так, как вам нравится. Или вы могли бы использовать эффект переключения.