Question

我正在尝试使用jQuery，html＆amp; amp; CSS没有用。基本上，它是一个带有使用jQuery的画廊滚动效果的导航列表。滚动联系链接会带来一个弹出窗口，其中包含联系信息，等等服务，等等。

我使用的图库脚本可以找到here

每当我申请.fadein（慢），我得到所需的影响，但相反。而不是从透明淡出到不透明:::你得到了图片。我也试过

.animate({opacity: '0.5'}, 1000)

与上述结果相同

我的jOuery脚本是什么样的：

<script type>
$(document).ready(function() {
    // Image swap on hover
    $("#gallery ul li img").hover(function(){
        $('#main-img').stop().fadeTo('slow',0.3).siblings()
          .stop().fadeTo('slow',1.0).attr('src',$(this).attr('src').replace('thumb/', ''));
    });
    // Image preload
    var imgSwap = [];
     $("#gallery ul li img").each(function(){
        imgUrl = this.src.replace('thumb/', '');
        imgSwap.push(imgUrl);
    });
    $(imgSwap).preload();
});
$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}
</script>

html：

<div id="left_nav">
    <div id="gallery">
     <img src="images/gallery/home.png" alt="" id="main-img" />
      <ul>
        <li class="home"><img src="images/gallery/thumb/home.png" alt="" /></li>
        <li class="about"><img src="images/gallery/thumb/About Us.png" alt="" /></li>
        <li class="contact"><img src="images/gallery/thumb/Contact Us.png" alt="" /></li>
        <li class="services"><img src="images/gallery/thumb/Services.png" alt="" /></li>
      </ul>
    </div> 
  </div>

我也试过反转不透明度设置，因为它看起来像是常识。这会导致不透明的效果，不会淡入。我正在拍摄的是对悬停状态的拇指的影响淡化。此外，淡入淡出脚本似乎在IE 8中不起作用。任何想法？

Answer 1

哇，有些链子在这里继续。为什么你也必须淡化兄弟姐妹（即ul标签）？也许你的意思是这个？

$('#main-img').attr('src', $(this).attr('src').replace('thumb/', '')).stop();
$('#main-img').hide();
$('#main-img').fadeIn();

故意不加束手。出于某种原因，将hide和fadeIn联系在一起可以使它在某些浏览器中停止工作，例如IE。

Answer 2

我猜你必须在淡入0.5或任何值之前将不透明度设置为0。如果不透明度为1并且您告诉它淡入0.5，它将从1 - >开始。 0.5。

jQuery淡入问题

2 个答案: