图像没有正确隐藏

我从零开始制作了一个JQuery轮播，到目前为止代码很好，它的效果非常好。图像没有正确隐藏

主要问题是当我尝试使用fadeOut函数与fadeIn函数并排使用图像堆栈时。

我不知道如何使它们重叠。

我试图玩绝对定位，但没有运气。

你可以清楚地看到它，当你走在我的网站http://techyhesh.com/Dogs/

HTML

<div class="carousel"> 

    <div id="background-slideshow"> 

     <div style="display: none;" id="img1" class="slides"> 
      <img src="/2015/03/Carosuel2.png"> 
      <div class="textblock"> 
       <p class="carousel-text1">Slider 1</p> 
       <p class="carousel-text2">His nose gets into everything</p> 
      </div> 
     </div> 
     <div style="display: block;" id="img2" class="slides"> 
      <img src="/2015/03/Carosuel.png"> 
      <div class="textblock"> 
       <p class="carousel-text1">Slider 2</p> 
       <p class="carousel-text2">His nose gets into everything</p> 
      </div> 
     </div> 
     <div style="display:none;" class="SlideJSON">2</div> 
    </div> 

</div>

jQuery(document).ready(function($) { 

var slides= $(".JSONNumber").html(); 

var slides= parseInt(slides); 

var animateInterval; 
var i = 1; 
var x = 2; 

function animate() { 


    $("#img" + i).fadeOut(2000) 
    $("#img" + x).fadeIn(2000); 


    if (i == slidenumber) { 

     $("#img1").fadeIn(2000); 

     i = 1; 
     x = 2; 

    } else { 
     i++; 
     x++; 
    } 

} 

animateInterval = setInterval(animate, 3000); 


})

来源

2015-04-01 Hashey100

请避免链接到外部网站，它们很容易链接腐烂。改为将您的示例转换为[最小，具体且可验证的示例]（http://stackoverflow.com/help/mcve）。 – Terry 2015-04-01 18:43:00

我不'看到任何'＃img'元素 – mohamedrias 2015-04-01 18:44:37

根据你的HTML，你使用的选择是错误的。

$("#img" + i)

应该

$("#slideimg" + i)

来源

2015-04-01 18:47:20 mohamedrias

幻灯片中的CSS

，只需添加display: inline-block;

来源

2015-04-01 18:57:37 Sushil

图像没有正确隐藏

回答

相关问题