悬停效果不透明度ie8答案

【问题标题】：hover effect opacity ie8悬停效果不透明度ie8
【发布时间】：2013-06-17 01:47:08
【问题描述】：

$(document).ready(function(){
$('.boxgrid.slidedown').hover(function(){
    $(".cover", this).stop().animate({opacity:'0'},{queue:false,duration:300});
}, function() {
    $(".cover", this).stop().animate({opacity:'1'},{queue:false,duration:300});
    });

    //Full Caption Sliding (Hidden to Visible)
    $('.boxgrid.captionfull').hover(function(){
    $(".cover", this).stop().animate({opacity:'1'},{queue:false,duration:250});
    }, function() {
    $(".cover", this).stop().animate({opacity:'0'},{queue:false,duration:250});
    });
});

我在图像上添加了悬停效果。在 IE8 中，.cover div 已经首先出现。为什么会这样？

【问题讨论】：

您应该发布您的 HTML 代码。也许甚至更详细地阐述你的问题。
这里是 html 代码。

{$product_name}

w {$product_price}
我的猜测是你必须用 CSS 隐藏悬停效果，这样你的 jQuery 代码才能显示它。但我无法真正弄清楚你的问题。

标签： jquery hover opacity

【解决方案1】：

首先在css中添加.cover {display:none}，你是否尝试过使用fadeIn/fadeOut

$(document).ready(function(){
    //Full Caption Sliding (Hidden to Visible)
    $('.boxgrid.captionfull').hover(function(){
    $(".cover", this).fadeIn(250);
    }, function() {
    $(".cover", this).fadeOut(250);
    });
});

如果你想添加 .stop()，你可以稍微调整一下

【讨论】：

{$product_name}

w {$product_price}