ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / список обратно не скрывается
10 сообщений из 35, страница 2 из 2
  2  все
список обратно не скрывается
    #38743911
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
PHucker, где полная, нормальная разметка?

То вы привели пример разметки, где несколько дивов с классом "box", то огрызок где <div id="box">, что говорит о том, что на странице один "box".
Но при этом Вы пишете про несколько списков.
...
Рейтинг: 0 / 0
11.09.2014, 10:57
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743912
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
"Объяснение" конечно полный пипец!
...
Рейтинг: 0 / 0
11.09.2014, 10:59
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743925
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
krvsa, ага :)

Вот, накидал:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
<!DOCTYPE html>
<html>  
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <style>
    #box {
      border: 1px solid black;
      width: 300px;
    }
    #box h4 { cursor: pointer; }
    #box ul {
      border: 1px solid black;
      width: 200px;
    }
  </style>
</head>
<body>
  <div id="box"> 
    <h4 class="menuTitle"><span>Информация</span></h4>		
    <ul class="centerMenu">
      <li class="menuItem">Пункт №1</li>
      <li class="menuItem">Пункт №2</li>
      <li class="menuItem">Пункт №3</li>
    </ul> 
    <h4 class="menuTitle"><span>Прокламация</span></h4>		
    <ul class="centerMenu">
      <li class="menuItem">Пункт №4</li>
      <li class="menuItem">Пункт №5</li>
      <li class="menuItem">Пункт №6</li>
    </ul> 
    <h4 class="menuTitle"><span>Жопа</span></h4>		
    <ul class="centerMenu">
      <li class="menuItem">Пункт №7</li>
    </ul> 
  </div>
  <script>
    function initialize() {
      var box = $('#box'),
          menu = box.children('.centerMenu'),
          menuTitle = box.children('.menuTitle');
      
      // Изначально выпадающие списки скрыты.
      // Также меню скрывается, когда курсор мыши выходит за его пределы.      
      menu.hide();
      menu.mouseleave(function () { $(this).hide(300); });
      
      // А если курсор мыши выходит за границы box-а, то скрываем все списки.
      box.mouseleave(function () { menu.hide(300); });
      
      // Показывается меню при наведении курсора мыши на его заголовок.
      menuTitle.on('mouseenter', 'span', function(){
         $(this).parent().next().show(300);
      });
    }
    
    $(document).ready(initialize());
  </script>
</body>
</html>


Ссылка на песочницу
...
Рейтинг: 0 / 0
11.09.2014, 11:08
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743926
PHucker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PHucker
Гость
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
<h4 class="menutitle"><span>Фото</span></h4>    
                <ul class="centermenu" style="height:105px;">
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                     </ul>   
                     <hr style="width: 180px; background-color: #003FAC; "/>
                     
                    
					<h4 class="menutitle"><span>Музыка</span></h4>
                     <ul class="centermenu" style="height: 40px;">
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                    </ul>
                    <hr style="width: 180px; background-color: #003FAC; "/>
                    
                <div id="box"> 
				<h4 class="menutitle"><span>Информация</span></h4>		
                <ul class="centermenu">
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                        <li class="centermenu"></li>
                </ul> 
				</div>

пока только с одним так пробовал, дав id только одному div'у. И собственно вот и скрипт который раскрывает и скрывает список при наведении на имя списка. А при наведении на пункты списка, список скрывается.
Код: javascript
1.
2.
3.
4.
5.
6.
$(document).ready(function(){
$("ul").hide();
$('h4 span').hover(function(){
$(this).parent().next().slideToggle();
}); 
});
...
Рейтинг: 0 / 0
11.09.2014, 11:08
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743928
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Опять огрызок разметки...

Ну да ладно, выше я накидал скрипт, претензии "а вот если так вести курсор мыши, то поведение не то" не принимаются
...
Рейтинг: 0 / 0
11.09.2014, 11:11
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743936
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Вообще меню надо переверстать на <ul>, в который вложены подменю (тоже <ul>), тогда всё встанет на свои места.
...
Рейтинг: 0 / 0
11.09.2014, 11:15
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743940
PHucker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PHucker
Гость
skyANA,

Спасибо огромное! Извиняюсь за то, что украл у вас время :)
...
Рейтинг: 0 / 0
11.09.2014, 11:21
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743953
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
skyANAВообще меню надо переверстать на <ul>, в который вложены подменю (тоже <ul>), тогда всё встанет на свои места.
Вот так:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
<!DOCTYPE html>
<html>  
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <style>
    #menu {
      border: 1px solid black;
      list-style: none;
      width: 300px;
    }
    #menu .subMenuTitle { cursor: pointer; }
    #menu .subMenu { display: none; } /* Изначально выпадающие списки (подменю) скрыты */
  </style>
</head>
<body>
  <ul id="menu">
    <li>
      <h4 class="subMenuTitle"><span>Информация</span></h4>
      <ul class="subMenu">
        <li class="menuItem">Пункт №1</li>
        <li class="menuItem">Пункт №2</li>
        <li class="menuItem">Пункт №3</li>
      </ul>
    </li>
    <li>
      <h4 class="subMenuTitle"><span>Прокламация</span></h4>
      <ul class="subMenu">
        <li class="menuItem">Пункт №4</li>
        <li class="menuItem">Пункт №5</li>
        <li class="menuItem">Пункт №6</li>
      </ul> 
    <li>  
    <li>
      <h4 class="subMenuTitle"><span>Жопа</span></h4>
      <ul class="subMenu">
        <li class="menuItem">Пункт №7</li>
      </ul> 
     </li>
  </div>
  <script>
    function initialize() {
      var menu = $('#menu'),
          menuItem = menu.children('li'),
          subMenuTitle = menuItem.children('.subMenuTitle');
      
      // Выпадающий список скрывается, когда курсор мыши выходит за пределы пункта меню.
      menuItem.mouseleave(function () {
        $(this).children('.subMenu').hide(300);
      });
      
      // Показывается выпадающий список при наведении курсора мыши на его заголовок.
      subMenuTitle.on('mouseenter', 'span', function(){
         $(this).parent().next().show(300);
      });
    }
    
    $(document).ready(initialize());
  </script>
</body>
</html>


Ссылка на песочницу

Ссылки на документацию:
.on()

.mouseenter()

.mouseleave()
...
Рейтинг: 0 / 0
11.09.2014, 11:35
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743955
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
PHuckerskyANA,

Спасибо огромное! Извиняюсь за то, что украл у вас время :)Да не за что. Учитесь формулировать свои мысли.

P.S. Я в отпуске
...
Рейтинг: 0 / 0
11.09.2014, 11:35
| Ответить | Цитировать | Написать  
список обратно не скрывается
    #38743977
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
P.P.S.: в примере выше закрывающий тег </div> необходимо заменить на </ul>.
...
Рейтинг: 0 / 0
11.09.2014, 11:47
| Ответить | Цитировать | Написать  
10 сообщений из 35, страница 2 из 2
  2  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / список обратно не скрывается
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38743955&tid=1446725]:
 0ms
get settings:
 11ms
get forum list:
 13ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 131ms
get topic data:
 8ms
get forum data:
 2ms
get page messages:
 36ms
get tp. blocked users:
 1ms
others: 249ms
total:  455ms
созд. / загр.: 455ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]