Посетитель
Покинул форум
Сообщений всего: 298
Дата рег-ции: Нояб. 2009
Помог: 14 раз(а)
|
jQuery только начал изучать, посему не обессудьте. Задача сделать эффект "раскрывающихся дверей электрички" при наведении курсора на объект.
Рабочий вариант , который у меня получился, содержит два отслеживания события:
CODE ( javascript):
скопировать код в буфер обмена
$(document).ready(function(){ $('.but_exter').hover( function(){ $(this).stop(1); $(this).animate({'background-position':'200px'},750); }, function(){ $(this).stop(1); $(this).animate({'background-position':'100px'},300); } ); $('.but_exter > div').hover( function(){ $(this).stop(1); $(this).animate({'background-position':'-200px'},750); }, function(){ $(this).stop(1); $(this).animate({'background-position':'-100px'},300); } ); });
Но изначально, я пытался сделать две операции, в одном блоке кода:
CODE ( javascript):
скопировать код в буфер обмена
$(document).ready(function(){ $('.but_exter').hover( function(){ $(this).stop(1); $(this).animate({'background-position':'200px'},750); $(this + " > div").stop(1); $(this + " > div").animate({'background-position':'-200px'},750); }, function(){ $(this).stop(1); $(this).animate({'background-position':'100px'},300); $(this + " > div").stop(1); $(this + " > div").animate({'background-position':'-100px'},300); } ); });
Однако, работать не захотело. Подскажите пожалуйста, в чем может быть загвоздка?
P.S. Перейдя по ссылке можно увидеть HTML, CSS, jQuery, которые я использую
(Добавление)
Упс! Вопрос можно закрыть, уже нашел ответ )) Пару дней как начал разбираться, поэтому не знал что нужно дочерний элемент выбирать так children([expr]). В итоге получил следующий код:
CODE ( javascript):
скопировать код в буфер обмена
$(document).ready(function(){ $('.but_exter').hover( function(){ $(this).stop(1); $(this).animate({'background-position':'200px'},750); $(this).children('div').stop(1); $(this).children('div').animate({'background-position':'-200px'},750); }, function(){ $(this).stop(1); $(this).animate({'background-position':'100px'},300); $(this).children('div').stop(1); $(this).children('div').animate({'background-position':'-100px'},300); } ); });
И второй более короткий вариант, если вдруг кому-то понадобится:
CODE ( javascript):
скопировать код в буфер обмена
$(document).ready(function(){ $('.but_exter').hover( function(){ $(this).stop(1).animate({'background-position':'200px'},750); $("div",this).stop(1).animate({'background-position':'-200px'},750); }, function(){ $(this).stop(1).animate({'background-position':'100px'},300); $("div",this).stop(1).animate({'background-position':'-100px'},300); } ); });
(Отредактировано автором: 20 Мая, 2011 - 16:34:40)
|
Главная
Помощь
Поиск
Пользователи
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript (Модератор: armancho7777777)
Без описания
