анимация при наведении изображения - PullRequest
Новая
       4

анимация при наведении изображения

1 голос
/ 15 июня 2010

У меня есть следующий скрипт jQuery, который заставляет оранжевый прозрачный эффект наведения на экран покрывать изображение, когда оно переворачивается.Как сделать так, чтобы этот сценарий анимировался и исчезал (с затуханием?) 

$(document).ready(function() {

    $('#gallery a').bind('mouseover', function(){
        $(this).parent('li').css({position:'relative'});
        var img = $(this).children('img');
        $('<div />').text(' ').css({
            'height': img.height(),
            'width': img.width(),
            'background-color': 'orange',
            'position': 'absolute',
            'top': 0,
            'left': 0,
            'opacity': 0.5
        }).bind('mouseout', function(){
            $(this).remove();
        }).insertAfter(this);
    });

});

1 Ответ

0 голосов
/ 15 июня 2010

попробовать .. 

$(document).ready(function() {

    $('#gallery a').bind('mouseover', function(){
        $(this).parent('li').css({position:'relative'});
        var img = $(this).children('img');
        $('<div />').text(' ').css({
            'height': img.height(),
            'width': img.width(),
            'background-color': 'orange',
            'position': 'absolute',
            'top': 0,
            'left': 0,
            'opacity': 0.5
        }).bind('mouseout', function(){
            $(this).fadeOut(function(){ $(this).remove(); }); // <--- added fadeout()
        }).insertAfter(this).fadein(); //  <--- added fadeIn()
    });

});
...