Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.75/4: Рейтинг темы: голосов - 4, средняя оценка - 4.75
0 / 0 / 1
Регистрация: 24.10.2014
Сообщений: 47
1

Оптимизировать скрипт

23.04.2017, 20:45. Просмотров 798. Ответов 3
Метки нет (Все метки)

Javascript
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
<script>
    $(function(){
    $(".menu1").click(function(){
    jQuery('.menu1').addClass("active");
    jQuery('#menu1').show();    
    jQuery('#menu2').hide();    
    jQuery('#menu3').hide();    
    jQuery('#menu4').hide();    
    jQuery('#menu5').hide();    
    jQuery('#menu6').hide();    
    jQuery('#menu7').hide();
    jQuery('.hid').hide();  
    jQuery('.menu2').removeClass("active"); 
    jQuery('.menu3').removeClass("active"); 
    jQuery('.menu4').removeClass("active"); 
    jQuery('.menu5').removeClass("active"); 
    jQuery('.menu6').removeClass("active"); 
    jQuery('.menu7').removeClass("active"); 
    
    
    
  });
  
  $(".menu2").click(function(){
    jQuery('.menu2').addClass("active");
    jQuery('#menu2').show();    
    jQuery('#menu1').hide();    
    jQuery('#menu3').hide();    
    jQuery('#menu4').hide();    
    jQuery('#menu5').hide();    
    jQuery('#menu6').hide();    
    jQuery('#menu7').hide();    
    jQuery('.hid').hide();  
    jQuery('.menu1').removeClass("active"); 
    jQuery('.menu3').removeClass("active"); 
    jQuery('.menu4').removeClass("active"); 
    jQuery('.menu5').removeClass("active"); 
    jQuery('.menu6').removeClass("active"); 
    jQuery('.menu7').removeClass("active"); 
    
    
  });
 });
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div id="menu1">
    Скрытый слой 1
</div>
<div id="menu2">
    Скрытый слой 1
</div>
 
 
<div class="menu1">Меню 1</div>
<div class="menu2">Меню 2</div>
 
 
<div class="hid">
  Контент, который скрывается при появлении окна
</div>
Есть такой скрипт (привел только часть,остальное повторяется). По клику на меню скрывается основной контент (слой hide) , открывается определенный скрытый слой (#menu1) и к меню добавляется класс active. для Как можно его оптимизировать,чтобы отказаться от огромного кода? И как еще добавить появление скрытого слоя с эффектом fade?
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
23.04.2017, 20:45
Ответы с готовыми решениями:

скрипт js который по нажатию на выделенное слово отменяет скрипт
Суть такова, что у меня есть сайт со скриптом поиска, когда я нашёл слово (оно выделенное) я хочу...

оптимизировать скрипт исправляющий ссылки в пагинации
Добрый день! Есть скрипт, который исправляет ссылки в пагинации. с ссылок вида :...

Как оптимизировать скрипт, который меняет ширину блока
Вот скрипт, который меняет ширину блока. Есть две ссылки, которые выполняют по клику функции...

Необходимо вставить в скрипт увеличения картинки, скрипт просмотра панорамы 360
Здравствуйте. У меня такой специфический вопрос, на моем сайте имеется скрипт для увеличения...

3
Game & FullStack Разраб
409 / 357 / 71
Регистрация: 27.02.2012
Сообщений: 1,318
Записей в блоге: 85
24.04.2017, 13:44 2
Лучший ответ Сообщение было отмечено Destroyer как решение

Решение

делается через родителя...

и сделайте логику попроще...

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div class="tab_container">
  <div id="menu1">
    Скрытый слой 1
  </div>
  <div id="menu2">
    Скрытый слой 1
  </div>
</div>
 
<div class="tab_controller">
  <a href="#menu1">Меню 1</a>
  <a href="#menu2">Меню 2</a>
</div>  
 
<div class="hid">
  Контент, который скрывается при появлении окна
</div>
Javascript
1
2
3
4
5
6
7
8
$(".tab_controller A").on('click', function(e){
  e.preventDefault();
  $('.tab_container DIV').hide();
  $('.tab_container .active').removeClass("active");
  var $item  = $( $(this).attr('href') );
  $item.addClass('active').show();
  $('.hid').hide();
})
1
0 / 0 / 1
Регистрация: 24.10.2014
Сообщений: 47
24.04.2017, 20:19  [ТС] 3
and_y87, спасибо за ответ! но как сделать,чтобы active присваивался к пункту меню, а не к модальному окну? И как добавить эффект fade к появлению окна?

Добавлено через 17 минут
В итоге получился такой скрипт:

Javascript
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
<script>
    $(function(){
    $(".leftmenu A").on('click', function(e){
  e.preventDefault();
        
        if($(this).hasClass('active')){$(this).removeClass('active');return;}
$('.leftmenu a').removeClass('active');
$(this).addClass('active');
  $('.modal .mod').hide();
  $('.modal .active').removeClass("active");
  var $item  = $( $(this).attr('href') );
  $item.addClass('active').fadeIn( "slow", function() {
    // Animation complete
  });
  $('.hid').hide();
})
  
  $(".close").click(function(){
    $('.modal .mod').hide();
    jQuery('.hid').fadeIn( "slow", function() {
    // Animation complete
  });
    jQuery('.leftmenu a').removeClass("active");    
    
    
    
  });
  
    });
    </script>
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="modal">
 <div id="menu1" class="mod">
    Скрытый слой 1
 </div>
 <div id="menu2" class="mod">
    Скрытый слой 1
 </div>
</div>
 
<a href="#menu1">Меню 1</a>
<a href="#menu2">Меню 2</a>
 
 
<div class="hid">
  Контент, который скрывается при появлении окна
</div>
0
Game & FullStack Разраб
409 / 357 / 71
Регистрация: 27.02.2012
Сообщений: 1,318
Записей в блоге: 85
25.04.2017, 08:39 4
Цитата Сообщение от Destroyer Посмотреть сообщение
and_y87, спасибо за ответ! но как сделать,чтобы active присваивался к пункту меню, а не к модальному окну? И как добавить эффект fade к появлению окна?
Javascript
1
2
3
4
5
6
7
$(".tab_controller A").on('click', function(e){
  e.preventDefault();
  $('.tab_container DIV').hide();
  $('.tab_controller A.active').removeClass("active");
  $('.hid').hide();
  $( $(this).addClass('active').attr('href') ).fadeIn();
})
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
25.04.2017, 08:39

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

Вызвать скрипт через другой скрипт
Всем привет! Такая ситуация. Есть скрипт 1, который служит для аякс подгрузки новостей. Есть скрипт...

Как оптимизировать скрипт?
Доброго времени суток! Практикуюсь в программировании на php,написал простенький скрипт,который...

Оптимизировать скрипт сортировки файлов
Имеется вот такой скриптик, сортирующий файлы по расширению имени #! /bin/bash # Сортировка...

Оптимизировать скрипт админки сайта
Всем ку! Имеется файл lock.php: &lt;?php $db = mysql_connect(&quot;localhost&quot;, &quot;u-1023&quot;, &quot;192847&quot;);...

Как оптимизировать скрипт для сайта?
Пытаюсь оптимизировать скрипт для сайта, который вызывается миллионы раз в день 1. В чем лучше...

Оптимизировать и привести в порядок скрипт для удаления обновлений
Вечер добрый :) В одной из тем около полугода назад я давал ответ Не смотря на то, что...


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

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

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