jquery - 使用可见性来切换隐藏元素？

Question

请看这个 fiddle http://jsfiddle.net/rabelais/e47xq/6/

当您将鼠标悬停在缩略图上时，会显示隐藏的图像，但我想使用 visibility: hidden 而不是 display: none，这可能吗？

$(".thumnails").on("mouseover mouseout", "a", function () {
$('[title="' + $(this).attr('href') + '"]').toggle();
 });

Answer 1

当然可以，只需创建自己的切换功能

$(".thumnails").on("mouseover mouseout", "a", function () {
    var flag = $(this).data('flag');

    $('[title="' + $(this).attr('href') + '"]').css('visibility', flag ? 'hidden' : 'visible');

    $(this).data('flag', !flag);
});

FIDDLE

或拆分事件

$(".thumnails").on({
    mouseover: function() {
        $('[title="' + $(this).attr('href') + '"]').css('visibility', 'visible');
    },    
    mouseout: function () {
        $('[title="' + $(this).attr('href') + '"]').css('visibility', 'hidden'); 
    }
}, 'a');

FIDDLE