Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Помогите с раздвигающимся меню

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Описание: Как скрыть открытый пункт при нажатии на другой пункт
Поиск в теме | Версия для печати
Webbender
Отправлено: 09 Июля, 2013 - 16:23:53
Post Id


Новичок


Покинул форум
Сообщений всего: 2
Дата рег-ции: Март 2013  


Помог: 0 раз(а)
Как скрыть открытый пункт при нажатии на другой пункт?
Например открыт пункт 1, нажымаю на пункт 2 и скрываеться пункт 1
Вот код меню
CODE (html):
скопировать код в буфер обмена
  1.  
  2. <ul id="spisok">
  3. <li><a href="#">пункт 1
  4.         <ul>
  5.             <li><a href="#">пункт 1.1</a></li>
  6.             <li><a href="#">пункт 1.2</a></li>
  7.         </ul>
  8. </li>
  9. <li><a href="#">пункт 2
  10.         <ul>
  11.             <li><a href="#">пункт 2.1</a></li>
  12.             <li><a href="#">пункт 2.2</a></li>
  13.         </ul>
  14. </li>
  15. <li><a href="#">пункт 3
  16.         <ul>
  17.             <li><a href="#">пункт 3.1</a></li>
  18.             <li><a href="#">пункт 3.2</a></li>
  19.         </ul>
  20. </li>
  21. </ul>
  22.  


CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. $(document).ready(function(){
  3.     $('#spisok > li > ul')
  4.         .hide()
  5.         .click(function(e){
  6.         e.stopPropagation();
  7. });
  8. $('#spisok > li').toggle(function(){
  9.     $(this).find('ul').slideDown();
  10.     }, function(){
  11.         $(this).find('ul').slideUp();
  12.     });
  13. });
  14.  

CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. #spisok, #spisok ul
  3. {
  4.     list-style-type: none;
  5.     margin: 0;
  6.     padding: 5px 0;
  7.         width:250px;
  8. }
  9. #spisok li
  10. {
  11.     padding: 5px 0;
  12. }
  13. #spisok li li
  14. {
  15.     padding: 5px 0 5px 14px;
  16. }
  17. #spisok li li:before
  18. {
  19.     content: '- ';
  20. }
  21.  
 
 Top
Denkill
Отправлено: 09 Июля, 2013 - 17:15:03
Post Id



Посетитель


Покинул форум
Сообщений всего: 330
Дата рег-ции: Янв. 2013  
Откуда: Барнаул


Помог: 7 раз(а)
<li> -> <li id="li1"> Итак соответсвенно к каждому пункту в списке

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. $("#li1").click(function(){
  3.  $("#li2").hide(50);
  4. });
  5.  


-----
Хо-Хо-Хо
 
 Top
AlexAnder
Отправлено: 09 Июля, 2013 - 17:23:48
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 915
Дата рег-ции: Авг. 2012  
Откуда: Россия


Помог: 34 раз(а)
CODE (javascript):
скопировать код в буфер обмена
  1. var childs = document.getElementById("spisok").childNodes;
  2. var lists = []
  3. var k = 0;
  4. for (var i = 0; i < childs.length; i++)
  5. {
  6.     if (childs[i] instanceof HTMLLIElement) {
  7.         var li = childs[i].childNodes;
  8.         for(var j = 0; j < li.length; j++) {
  9.             if (li[j] instanceof HTMLUListElement) {
  10.                 lists[k] = li[j];
  11.                 lists[k].style.display = "none";
  12.                 k++
  13.             } else if (li[j] instanceof HTMLAnchorElement) {
  14.                 li[j].onclick = function(x)
  15.                 {
  16.                     return function()
  17.                     {
  18.                         for(var n = 0; n < lists.length; n++)
  19.                         {
  20.                             lists[n].style.display = "none";
  21.                         }
  22.                         lists[x].style.display = "";
  23.                         return false;
  24.                     }
  25.                 }(k)
  26.             }
  27.         }
  28.     }
  29. }

Ха-ха
Спойлер (Отобразить)

(Отредактировано автором: 09 Июля, 2013 - 19:19:54)



-----
Оказывается, недостаточно читать справочники, чтобы правильно писать коды. sadex ©

Форумы стали местом обучения программированию, а не решения трудных вопросов. KingStar ©
 
 Top
AlexAnder
Отправлено: 09 Июля, 2013 - 19:27:18
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 915
Дата рег-ции: Авг. 2012  
Откуда: Россия


Помог: 34 раз(а)

лучше сразу посмотреть как это работает, а потом уже и «код» смотреть


-----
Оказывается, недостаточно читать справочники, чтобы правильно писать коды. sadex ©

Форумы стали местом обучения программированию, а не решения трудных вопросов. KingStar ©
 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB