Question

这是一个缩略图 - 一个简单的不透明度设置然后悬停功能。

我错过了什么？这适用于大多数浏览器（包括IE7），但在IE8中我什么都没得到。

<script type="text/javascript">
    $(function() {
        // set opacity on page load
        $(".image-thumb").css("opacity", "0.6");
        // on mouse over
        $(".image-thumb").hover(
          function() {
            // animate opacity to full
            $(this).stop().animate({
                opacity: 1
            }, "slow");
          },
          // on mouse out
          function() {
            // animate opacity
            $(this).stop().animate({
                opacity: 0.6
            }, "slow");
          }
        );
    })
</script>

Answer 1

看起来你是以一种非常艰难的方式做到这一点，至少与我这样做的方式相比。也许试试这个：http://jsfiddle.net/BAJPs/

    $('.image-thumb').bind('mouseover mouseout', function(event) {
        if (event.type == 'mouseover') {
           $(this).stop().animate({
              opacity: 1
           }, "slow");          
        } else {
           $(this).stop().animate({
              opacity: 0.6
              }, "slow");           
        }
    });

更新

我刚检查了我的解决方案，以及你在IE8中发布的内容，两者都有效！

Answer 2

http://www.w3schools.com/css/css_image_transparency.asp

img
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
img:hover
{
opacity:1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
}

Answer 3

使用此：

$（ '图像拇指。 '）fadeTo（' 快'，6）;

希望它有所帮助。

jQuery悬停不透明IE8

3 个答案:

更新