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

@maxon3000 · Регистрация: 08.04.2018

Студворк — интернет-сервис помощи студентам

В общем при сужении экрана появляется бургер, но при нажатии скрипт не срабатывает
Вот исходник:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<ul id="menu">
  <div class="icon">☰</div>
  <div class="items">
    <li><a href="#">Home</a></li>
    <li><a href="#">Blog</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Contact</a></li>
  </div>
</ul>
<div class="content">
  <h2>Responsive Dropdown Menu - resize the window to see it in action</h2>
  Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justoolor sit amet.
</div>

CSS
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
body,html {
  padding:0;
  margin:0;
  font: 14px Helvetica, Arial;
}
#menu {
  margin:0;
  background: #c0392b;
  width: 100%;
  padding: 20px 0;
  text-align: center;
}
 
#menu a {
  color: #fff;
  text-decoration: none;
}
 
#menu a:hover {
  color: #ccc;
}
 
#menu ul {
  padding:0;
  margin:0;
}
 
.items li {
  list-style: none;
  display:inline;
  padding-right: 15px;
  width:100%;
  margin: 0 auto;
}
 
.icon {
  color: #fff;
  cursor: pointer;
  display: none;
  font-size:24px;
}
 
.showitems {
  display:block !important;
}
 
.content {
  padding: 15px 0;
  width:60%;
  margin: 0 auto;
  line-height:22px;
}
 
@media screen and (max-width: 800px) {
  .icon {
     display:block; 
  }
   .items {
    display:none;   
  }
  .items li {
    display:table;
    padding:10px 0;
  }
}

JavaScript
1
2
3
4
5
6
7
8
9
10
11
$(function() {
  $('.icon').click(function() {
    
    if($('.items').is(':visible')) {
      $('.items').removeClass('showitems'); 
    }
    else {
      $('.items').addClass('showitems'); 
    }   
 }); 
});

https://codepen.io/4gray/pen/FEujv , здесь все работает, но когда ставлю у себя, то нет. Спасибо за помощь

@sad67man · 13.05.2018, 22:49

maxon3000, Видимо как-то неправильно ставите. Надо смотреть ваш неработающий вариант. Так сложно сказать. В консоли нет ошибок? jQuery подключен?

Новые блоги и статьи Все статьи Все блоги /
Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .	Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .
Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .

@sad67man 2604 / 1508 / 689 Регистрация: 23.08.2015 Сообщений: 3,839
	13.05.2018, 22:49
	maxon3000, Видимо как-то неправильно ставите. Надо смотреть ваш неработающий вариант. Так сложно сказать. В консоли нет ошибок? jQuery подключен? 0