jquery - CSS 3D 翻转 jQuery

Question

当我mouseover翻过任何盒子时，facebook、twitter 视频卷轴等在翻转后看起来就像是镜面反射。它只有铬。而在 Firefox 中，它按预期运行。

这是我的网页http://luutaa.co.in/TMcollection/

请建议我一个解决方案来解决它？

Answer 1

从您的评论中：

你想隐藏镜像文本，然后尝试这样

当你做 a 时mouseover，隐藏.fbbtn块

$('.fbbtn').hide();

并让它callback展示它

$('.fbbtn').show();

希望你有一个想法。

更新：经过进一步调查，我找到了正确的应用位置

$('.thumb').hover(function () {
   $(this).find('.fbbtn').hide();  //HIDE UPON HOVER
    $(this).find('.thumb-detail').stop().animate({
        bottom: 0
    }, 500, 'easeOutCubic');
},

function () {
    $(this).find('.fbbtn').show();  //SHOW IT IN CALLBACK
    $(this).find('.thumb-detail').stop().animate({
        bottom: ($(this).height() * -1)
    }, 500, 'easeOutCubic');
});

Answer 2

一个简单的解决方法是将其添加到您的 CSS 中：

.flipIt .fbbtn{
    display:none;
}

虽然当您将鼠标悬停在框上时它会产生一些闪烁，但如果您觉得这不可接受，您可能需要实现 @user1671639 的答案，并且可能仅在 CSS 动画完成后使用计时器来显示按钮