Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2015, 23:01
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

Можно ли оптимизировать код?
сделал вот такой код (при наведении на кнопку меняется прозрачность родительского DIV, но только при наличии второго дополнительного класса)
$('.trigger').on({
    mouseenter: function(){
	if ($(this).hasClass('inactive')) {$(this).parents('div.forabg').animate({ opacity: '1.0' }, 300); }
    },
    mouseleave: function(){
	if ($(this).hasClass('inactive')) {$(this).parents('div.forabg').animate({ opacity: '0.3' }, 300); }    }
});


хочется условия сделать общим.
гуру, можно ли как-то оптимизировать данный код? или оставить как есть?
Ответить с цитированием
  #2 (permalink)  
Старый 10.03.2015, 23:13
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

$('.trigger').on('mouseenter mouseleave', '.inactive', function (e) {
      $(this).parents('div.forabg').animate({
        opacity: e.type == 'mouseenter' ? '1.0' : '0.3'
      }, 300);
    });

примерно так
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2015, 23:41
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

не работает, хотя и ошибок нет.
Ответить с цитированием
  #4 (permalink)  
Старый 10.03.2015, 23:42
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

alecto,
$('div.forabg').on('mouseenter mouseleave', '.trigger.inactive', function(event) {
      var opacity = event.type == 'mouseenter' ? '1.0' : '0.3'
      $(event.delegateTarget).stop(true).animate({
          opacity: opacity
      }, 300)
  })
Ответить с цитированием
  #5 (permalink)  
Старый 10.03.2015, 23:50
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

супер! пашет!
но, очень сложная для моего понимания конструкция.
вернее я ее готовую понимаю, но сам построить в таком виде не смогу.

Рони, если бы вы мне еще объяснили, как благодарности вам поставить... никак сайт не позволяет

скажите пожалуйста, можно ли к этому коду добавить что-то типа
transition-delay:1s; из варианта CSS? чтобы при наезде мыши была небольшая задержка, "защита" от случайной проводки.
но, чтобы при уходе мыши - все работало как сейчас, без задержки.
Ответить с цитированием
  #6 (permalink)  
Старый 11.03.2015, 00:05
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Сообщение от alecto
"защита" от случайной проводки.
$('div.forabg').on('mouseenter mouseleave', '.trigger.inactive', function(event) {
    var opacity = event.type == 'mouseenter' ? '1.0' : '0.3'
    $(event.delegateTarget).stop(true,true).delay(100).animate({ opacity: opacity }, 300)
})
Ответить с цитированием
  #7 (permalink)  
Старый 11.03.2015, 00:14
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

работает, но в обе стороны.
чтобы поставить задержку только на mouseenter , надо вернуться к варианту первого сообщения с использованием .stop(true,true).delay(100)
?
Ответить с цитированием
  #8 (permalink)  
Старый 11.03.2015, 00:18
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

alecto,
посмотрите на вторую строку и замените 100 на 0 и 100
Ответить с цитированием
  #9 (permalink)  
Старый 11.03.2015, 00:22
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

alecto,
$('div.forabg').on('mouseenter mouseleave', '.trigger.inactive', function(event) {
    var time = 100, opacity = event.type == 'mouseenter' ?  '1.0' : (time = 0,'0.3');
    $(event.delegateTarget).stop(true,true).delay(time).animate({ opacity: opacity }, 300)
})
Ответить с цитированием
  #10 (permalink)  
Старый 11.03.2015, 00:31
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

мда, черт ногу сломит, но код работает!
фантастика!
премного благодарен, мудрейший Рони!!!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как можно скопировать js код с другого сайта vuler Общие вопросы Javascript 1 17.02.2015 18:05
Где можно найти этот java код? 1man1 Общие вопросы Javascript 4 20.12.2011 23:12
Оптимизировать код vazerdim jQuery 7 14.03.2011 13:42
О правилах написания JS... Можно ли разбить код? stah22 Общие вопросы Javascript 9 02.06.2010 13:26
Помогите оптимизировать код. pizzZ jQuery 5 17.11.2009 23:52