0 / 0 / 0
Регистрация: 01.09.2015
Сообщений: 13
1

Не могу заставить работать меню как надо

25.12.2015, 16:06. Показов 367. Ответов 3
Метки нет (Все метки)

Добрый день!

Я новичок в jquery, никак не могу решить задачу! Помогите плиз.

Условие:
Дано двухуровневое выпадающее меню типа:
HTML5
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<head>
 
<title>Стили</title>
 
<script src="/html5.js"></script>
<script src="/jquery.min-1.11.js"></script>
 
<style type="text/css">
.menu {
    position: relative;
}
    .menu li {
        float: left;
        list-style-type: none;
        height: 52px;
        width: 200px;
    }
        .menu li a {
            display: block;
            padding: 15px 26px;
            color: #000;
            background-color: #ffd35e;
        }
            .menu li a:hover {
                background-color: #78cfe0; 
            }       
            .menu li a.active1 {
                background-color: #78cfe0; 
            }
            .menu li a.active2 {
                background-color: #ffd35e;
            }           
 
.menu li ul { 
    z-index: 999;
    position: absolute;
    background: #efefef;
    padding-left: 0;    
}
    .menu li ul li {
        height: auto;
        float: none;
        vertical-align: middle;
    }
        .menu li ul li a {
            text-align: left;
            padding: 6px 25px   
        }
            .menu li ul li a:hover {
                background: #78cfe0;
            }
            .menu li ul li a.podMenuActive  {
                background-color: #c8dce0; 
            }
</style>
</head>
 
<body>
<ul class="menu">
    <li><a href='#'>меню 1</a>
        <ul>
            <li><a href='#'>подменю 1.1</a></li>
            <li><a href='#'>подменю 1.2</a></li>
        </ul>
    </li>
    <li><a class="active1" href='#'>меню 2</a>
        <ul>
            <li><a href='#'>подменю 2.1</a></li>
            <li><a href='#'>подменю 2.2</a></li>
        </ul>
    </li>
    <li><a href='#'>меню 3</a>
        <ul>
            <li><a href='#'>подменю 3.1</a></li>
            <li><a href='#'>подменю 3.2</a></li>
        </ul>
    </li>
</ul>
 
 
 
<script>
        $(document).ready(function() {
        
            $(".menu li ul").hide();
            
            $(".menu li").hover(function(e){
 
                $(this).children(".menu li ul").stop().slideToggle(300);
                $(this).children(".menu li a").toggleClass("active1");
            });
                    
            //Добавляет класс активации подменю
            $(".menu li ul li").hover(function(e){
                $(this).children(".menu li ul li a").toggleClass("podMenuActive");
            });
        });
 
</script>
<body>
</html>
ЗАДАЧА
Выше изложено полностью рабочее меню, но необходимо реализовать так, чтобы при наведении курсора на пункт меню 3 или 1 окраска активного меню 2 стала желтой (неактивной), но если человек передумал нажимать на какой либо другой пункт меню и убрал курсор с меню, то пункт 2 должен автоматически становится синим.
__________________
Помощь в написании контрольных, курсовых и дипломных работ здесь
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
25.12.2015, 16:06
Ответы с готовыми решениями:

Заставить время работать как надо ))))
Суть проблемы: Сущ таблица Т_Заказы, для ее заполнения сущ форма Ф_Заказы. В таблице есть графа...

AT90USB162 (не могу заставить хоть как-то работать)
схема - контроллер+ кварц керамика 8МГц, кнопка ресета и входа в бутлоадерс подтяжками 10кОм,...

Как заставить сайт написанный на 5.3 заставить работать на 5.6? Как принудительно включить register_globals?
Есть древний сайт. Работает на php 5.3. Как объяснил разработчик данного сайта - все дело в...

Не могу заставить работать
Вот код, почему не хочет работать? &lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot;...

3
196 / 178 / 41
Регистрация: 23.10.2015
Сообщений: 764
25.12.2015, 22:29 2
ruler_v, в строке 67 присвоен класс "active1", по какой причине? Если не прописывать изначально этот класс, то всё хорошо работает.
0
0 / 0 / 0
Регистрация: 01.09.2015
Сообщений: 13
26.12.2015, 08:29  [ТС] 3
В этом то и суть!
Класс "active1" присваивается к пункту меню в разделе которого находится на текущий момент человек, чтобы ему было удобно понять свое местонахождение. Как только посетитель из текущего раздела захочет посетить другой раздел при наведении курсора к любому пункту меню класс "active1" должен удалятся. Если пользователь вдруг передумал (пошел курить, выпить чашку чая, отвлекли или задумался) и решил не предпринимать каких-либо действий остаться в текущем же разделе сайта, убрав курсор от меню, то класс "active1" должен присваиваться обратно, т.е. к тому же пункту меню в котором он находился, чтобы когда посетитель вернулся к сайту он понимал в каком разделе находится. Надеюсь понятно объяснил.
0
0 / 0 / 0
Регистрация: 01.09.2015
Сообщений: 13
28.12.2015, 10:58  [ТС] 4
Некому помочь?
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
28.12.2015, 10:58

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

Не могу заставить работать move_upload_file
делаю электронную библиотеку для колледжа застрял на моменте загрузки файла на сервер Надо...

Не могу заставить tor работать
Скачал себе пакеты tor на убунту, но по факту ничего не изменилось. Как узнать причину, почему тор...

Не могу заставить серву работать
Добрый день! Точнее не то, что не могу, стандартные примеры работают на ура! Не могу запустить...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.