Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.06.2014, 11:45
Новичок на форуме
Отправить личное сообщение для vetrox Посмотреть профиль Найти все сообщения от vetrox
 
Регистрация: 09.06.2014
Сообщений: 3

модернизировать меню-аккордеон
Доброго времени суток Вам!
В этом вопросе новичок, простите если вопрос покажется глупым...

нужно изменить данный скрипт так, чтобы при открытии одного список, другой закрывался.

перерыл разные примеры, но так и не получилось просто нужно вот именно этот код подправить:

<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<style>
#spisok, #spisok ul
{
    list-style-type: none;
    margin: 0;
    padding: 5px 0;
}
#spisok li
{
    padding: 5px 0;
}
#spisok li li
{
    padding: 5px 0 5px 14px;
}
#spisok li li:before
{
    content: '- ';
}
</style>
</head>
<script>
$(document).ready(function(){
    $('#spisok > li > ul')
        .hide()
        .click(function(e){
        e.stopPropagation();
});
$('#spisok > li').toggle(function(){
    $(this).find('ul').slideDown();
    }, function(){
        $(this).find('ul').slideUp();
    });
});
</script>
<body>
<ul id="spisok">
<li><a href="#">1 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
        </ul>
</li>
<li><a href="#">2 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
        </ul>
</li>
<li><a href="#">3 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
        </ul>
</li>
</ul>
</body>
</html>


Благодарю за внимание!!!

Последний раз редактировалось vetrox, 09.06.2014 в 11:57.
Ответить с цитированием
  #2 (permalink)  
Старый 09.06.2014, 12:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

vetrox,
на форуме 100500 таких примеров и забудьте о toggle не читайте старых док
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<style>
#spisok, #spisok ul
{
    list-style-type: none;
    margin: 0;
    padding: 5px 0;

}
#spisok ul{
   display: none;
}

#spisok li
{
    padding: 5px 0;
}
#spisok li li
{
    padding: 5px 0 5px 14px;
}
#spisok li li:before
{
    content: '- ';
}

</style>
<script>
$(function(){
    $('#spisok a')
        .click(function(e){
        e.stopPropagation();
        $('#spisok a').not(this).next('ul').slideUp();
        $(this).next('ul').slideToggle()
});
});
</script>
</head>
<body>
<ul id="spisok">
<li><a href="#">1 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
        </ul>
</li>
<li><a href="#">2 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
        </ul>
</li>
<li><a href="#">3 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
        </ul>
</li>
</ul>
</body>
</html>

Последний раз редактировалось рони, 06.01.2022 в 20:45.
Ответить с цитированием
  #3 (permalink)  
Старый 09.06.2014, 12:32
Новичок на форуме
Отправить личное сообщение для vetrox Посмотреть профиль Найти все сообщения от vetrox
 
Регистрация: 09.06.2014
Сообщений: 3

отлично ! спасибо! только они открываются все в развернутом виде как их свернуть при открытии страницы?
Ответить с цитированием
  #4 (permalink)  
Старый 09.06.2014, 12:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сообщение от vetrox
только они открываются все в развернутом виде
и в каком браузере неработает строка 15?
Ответить с цитированием
  #5 (permalink)  
Старый 09.06.2014, 13:03
Новичок на форуме
Отправить личное сообщение для vetrox Посмотреть профиль Найти все сообщения от vetrox
 
Регистрация: 09.06.2014
Сообщений: 3

пардон! забыл добавить эту строчку!
сколько дней я провозился с ним....

Слава Богу за Вас, рони!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вертикальное меню - аккордеон. Проблема. notgosu Events/DOM/Window 5 23.01.2013 11:47
Аккордеон меню, как доработать код. Gawk Общие вопросы Javascript 1 23.07.2012 13:01
меню в стиле аккордеон из таблицы chdn Элементы интерфейса 1 10.11.2011 21:15
Проблема с аккордионом и меню Tie ExtJS 3 01.09.2011 14:36
Сворачивающееся меню (аккордеон). Странные вещи StormMan Элементы интерфейса 2 09.06.2010 05:56