我想创建一个基本的jQuery 2图像幻灯片。我不希望图像相互融合，他们应该只是简单地改变每一秒。在下面的jQuery代码中，代码包含淡入淡出。什么是没有衰落的正确的代码？基本2图像幻灯片在Jquery

<div id="manwrapper"> 
    <div> 
     <img src="images/index-man.png" width="500" height="788" alt="SS Image" /> 
    </div> 
    <div> 
     <img src="images/index-man2.png" width="500" height="788" alt="SS Image" /> 
    </div> 
</div> 
<!--end manwrapper-->

CSS

#container #manwrapper { 
    float: right; 
    margin-top: -280px; 
    z-index: 3; 
    position:relative; 
    width:500px; 
    height:788px; 
} 
#container #manwrapper > div { 
    position:absolute; 
}

的JavaScript

setInterval(function() { 
    $('#manwrapper > div:first') 
     .fadeOut(1000) 
     .next() 
     .fadeIn(1000) 
     .end() 
     .appendTo('#manwrapper'); 
}, 3000);

来源

2013-05-20 user2382538

你试图删除的行'.fadeOut（1000）'和'.fadeIn（1000）'？ – hexblot

是的，这确实有用。谢谢！ – user2382538

删除'fadeOut(1000)和.fadeIn(1000)。

Demo

来源

2013-05-20 15:05:32

@ahul maindargi，@ Derek Henderson使用此代码时，图像会逐渐淡入彼此，图像的左下角以相互排列的方式向上移动到中央。简单地删除线fadeout（1000）和.fadein（1000）效果最好。 – user2382538

是的，当您离开您的评论时，正在创建小提琴。我在小提琴中看到了这一点，并相应地改变了我的答案。 –

尝试......

setInterval(function() { 
    $('#manwrapper > div:first') 
    .hide(1000) 
    .next() 
    .show(1000) 
    .end() 
    .appendTo('#manwrapper'); 
}, 3000);

来源

2013-05-20 15:05:06

基本2图像幻灯片在Jquery

CSS

的JavaScript

回答

相关问题