Помогите сделать выпадающий список

Код

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <title>Раскрывающиеся списки</title>
   <!--[[if lt IE 9]]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script>
   <style type="text/css">
   * { margin: 0; padding: 0; }
   body { background: #f0f0f0; font-family: sans-serif; }
   aside { display: block; }
   .box {
   display: table;
   margin: 10px auto;
   background: #fff;
   border: 1px solid #d1d1d1;
   padding: 4px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-box-shadow: 0px 0px 10px #ddd;
   -webkit-box-shadow: 0px 0px 10px #ddd;
   }
   h2 {
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   padding: 5px;
   background: -moz-linear-gradient(center top, #efefef 0%,#e0e0e0 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #efefef),color-stop(1, #e0e0e0));
   border: 1px solid #d1d1d1;
   color: #c1c1c1;
   font-size: 13px;
   font-weight: normal;
   text-shadow: 1px 1px 0px #fff;
   }
   h2 span { float: right; cursor: pointer; }
   h2 span:hover { text-shadow: 0px 0px 3px #a1eeff; }
   ul { padding: 5px; overflow: hidden; }
   ul li { font-size: 13px; list-style-type: square; list-style-position: inside; color: #a1a1a1; padding: 5px; }
   </style>
   
   
</head>

<body>
<aside>
<div class="box">
    <h2>Список №1<span class="expand">+</span></h2>
    <ul>
        <li>Пункт №1</li>
        <li>Пункт №2</li>
        <li>Пункт №3</li>
        <li>Пункт №4</li>
    </ul>
</div>
<div class="box">
    <h2>Список №2<span class="expand">+</span></h2>
    <ul>
        <li>Пункт №5</li>
        <li>Пункт №6</li>
        <li>Пункт №7</li>
        <li>Пункт №8</li>
    </ul>
</div>
<div class="box">
    <h2>Список №3<span class="expand">+</span></h2>
    <ul>
        <li>Пункт №9</li>
        <li>Пункт №10</li>
        <li>Пункт №11</li>
        <li>Пункт №12</li>
    </ul>
</div>
<div class="box">
    <h2>Список №4<span class="expand">+</span></h2>
    <ul>
        <li>Пункт №5</li>
        <li>Пункт №6</li>
        <li>Пункт №7</li>
        <li>Пункт №8</li>
    </ul>
</div>
</aside>
<script type="text/javascript">
   $(document).ready(function()
   {
      $("ul").hide();
      $("ul li:odd").css("background-color", "#efefef");
      $("h2 span").click(function()
      {
         $(this).parent().next().slideToggle();
      });
   });
</script>
</body>
</html>

Новые темы	Объявления	Свободное общение
20:33 Ап выдачи Яндекса 8 апреля - есть движение, но интереснее что творится с AI-ответами Google 15:45 Смотреть здесь 15:33 опубликовано здесь 13:50 Штрафы за крипту до 2 млн + ап Яндекса 19 апреля - что опять поменяли и куда всё катится? 12:39 В Яндексе позиции держатся, а трафик проседает - стало заметно сильнее 12:32 Яндекс-ап 20 марта и похороны ChatGPT, Claude и Gemini. Считаем убытки 23:03 monetizer.agency – рекламная сеть для взрослого и развлекательного трафика. 100$ новому вебмастеру	20:35 Продам сайт - продукты питания 16:38 Продам Домен: 6bc.ru 15:43 Продам аккаунты Gmail USA IP \| Gmail MIX IP \| Outlook Old 15:12 Betatransfer.net - обменник электронных валют 13:24 EM24.biz - обмен валют 11:11 Вериф аккаунты АВИТО + платежи 10:05 Мониторинг обменников Сrypto-scout.io	20:36 Точные прогнозы на футбол 20:31 Во Франции начали штрафовать за IPTV - до 300-400 евро уже прилетает обычным пользователям 12:37 Список обновленных тем пуст... 12:34 Осталось 3-5 месяцев до блокировки YouTube в России, — заявил Клименко 23:00 арбитражники 18:58 Ставки на супер тренды в спорте 21:08 Подтягиваем физкультурку

Новые темы

Объявления

Свободное общение

20:33 Ап выдачи Яндекса 8 апреля - есть движение, но интереснее что творится с AI-ответами Google
15:45 Смотреть здесь
15:33 опубликовано здесь
13:50 Штрафы за крипту до 2 млн + ап Яндекса 19 апреля - что опять поменяли и куда всё катится?
12:39 В Яндексе позиции держатся, а трафик проседает - стало заметно сильнее
12:32 Яндекс-ап 20 марта и похороны ChatGPT, Claude и Gemini. Считаем убытки
23:03 monetizer.agency – рекламная сеть для взрослого и развлекательного трафика. 100$ новому вебмастеру

20:35 Продам сайт - продукты питания
16:38 Продам Домен: 6bc.ru
15:43 Продам аккаунты Gmail USA IP | Gmail MIX IP | Outlook Old
15:12 Betatransfer.net - обменник электронных валют
13:24 EM24.biz - обмен валют
11:11 Вериф аккаунты АВИТО + платежи
10:05 Мониторинг обменников Сrypto-scout.io

20:36 Точные прогнозы на футбол
20:31 Во Франции начали штрафовать за IPTV - до 300-400 евро уже прилетает обычным пользователям
12:37 Список обновленных тем пуст...
12:34 Осталось 3-5 месяцев до блокировки YouTube в России, — заявил Клименко
23:00 арбитражники
18:58 Ставки на супер тренды в спорте
21:08 Подтягиваем физкультурку

09.03.2026 09:00	Помогите, пожалуйста...
04.02.2023 09:13	Помогите придумать самый интересный вопрос
07.10.2022 21:25	Помогите придумать название
19.09.2022 19:58	VK собрался сделать из VK Play российский аналог Steam
31.08.2021 22:58	Подают в суд за то, что решил сделать в деревне дорогу?

Предвкушающий Сообщений: 876 Регистрация: Май 2012	#3 30 Ноября 2013 03:33 Посмотри у меня в подписи, есть несколько вариантов. Вот как пример: _coder.hol.es/archive/spoiler_jq Проверенные скрипты и полезности для сайта© Coder