Текст отображается плавно при наведении миниатюры. Это плагин JQuery или просто CSS? - PullRequest
Новая
       35

Текст отображается плавно при наведении миниатюры. Это плагин JQuery или просто CSS?

0 голосов
/ 14 марта 2010

Я не знаю точных слов, чтобы описать это поведение на следующих страницах: http://kyanmedia.com/ и http://www.jayhollywood.com.au/. При наведении на картинки (миниатюры). Текст отображается плавно. Это плагин jquery или просто CSS?

Как воспроизвести это поведение / эффект?

1 Ответ

2 голосов
/ 14 марта 2010

Проверьте это на CSS-хитрости:

http://css -tricks.com / примеры / GarageDoorMenu.zip

и

http://css -tricks.com / примеры / GarageDoorMenu /

Редактировать

Используются два DIV, расположенных друг над другом. Затем, когда вы наведите курсор мыши, он будет анимировать свойство background-position элемента div "garage-door". Дверь гаража прозрачна под графикой «двери», так что вы можете видеть слой ниже.
Эта конкретная реализация использует JQuery: 

$(".link").hover(function(){
    $(this).parent().stop()
        .animate({backgroundPosition: '(0px -100px)'}, 500 );
}, function() {
    $(this).parent().stop()
        .animate({backgroundPosition: '(0px 0px)'}, 500 );
});
...