当使用jQuery动画相邻图像时，文本在Safari中消失

Question

当您快速翻转/关闭文本时，项目主列表on this page中的文字正在消失。

我无法弄清楚为什么它只在Safari中发生？ （在Chrome / Firefox中很好......甚至在IE9中也是如此）

谢谢！

    function projectImageRollovers() {
    $('#projects li a').mouseenter(function() {
        // if($('ul#work-menu').hasClass('desktop')) {
        if($(window).width() > 768) {
            $(this).parent().stop().find('.project-thumb').fadeTo("fast", 0.4);
        }
    });
    $('#projects li a').mouseleave(function() {
        $(this).parent().stop().find('.project-thumb').fadeTo("fast", 0);
    });
}
projectImageRollovers();

Answer 1

您可以尝试使用纯CSS而不是Javascript：

#projects li img {
  opacity: 0;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}

#projects li:hover img {
  opacity: 0.4;
}