Не могу анимировать изображения с помощью jquery - PullRequest
Новая
       26

Не могу анимировать изображения с помощью jquery

0 голосов
/ 13 января 2012

Я не знаю, упускаю ли я что-то раньше, но я думал, что вы можете анимировать изображения в jquery?В принципе, я хочу добиться чего-то подобного http://jsfiddle.net/Qm2FG/, но с ценниками на этом сайте http://nagomedia.blackflow.pl.

1 Ответ

0 голосов
/ 13 января 2012

Ну, вы просто используете код, который вы указали в своем вопросе, но вам нужно выбрать правильные элементы в вашем HTML-документе: 

$('.content').children('.main').children().hover(function() {
    $(this).stop(true, true).animate({ top : "-=0.45em" }, 150);            
}, function() {
    $(this).stop(true, true).animate({ top :"+=0.45em" }, 150);
});

Когда я публикую этот код в моей консоли разработчика на вашем веб-сайте, ваши теги начинают анимироваться, когда я наводю на них курсор.

Обратите внимание на использование .stop(), что полезно при использовании модификаторов -= и +=.

UPDATE

Вам нужно либо поместить свой JS в конец документа HTML (мой личный фаворит), либо поместить код в обработчик событий document.ready.Ваш код пытается привязать элементы, которые еще не существуют, поэтому привязка не выполняется. 

$(function () {
    $('.content').children('.main').children().hover(function() {
        $(this).stop(true, true).animate({ top : "-=0.45em" }, 150);            
    }, function() {
        $(this).stop(true, true).animate({ top :"+=0.45em" }, 150);
    });
});

Мне нравится помещать свой код JS в конец моих документов HTML, чтобы они незаблокировать рендеринг страницы.CSS входит в <head>, поэтому он доступен для правильного оформления документа, а JS располагается внизу для запуска после настройки DOM.

...