jQueryスライディングバナーが失敗する

Question

このコードで何が問題なのか分かりませんが、スライディングバナーは機能しません。

<div id="wrapper-banner"> 
      <div class="alive"><a href="#"><img src="pic1.jpg"></a></div> 
      <div><a href="#"><img src="pic2.jpg"></a></div> 
      <div><a href="#"><img src="pic3.jpg"></a></div> 
      <div><a href="#"><img src="pic4.jpg"></a></div> 
      <div><a href="#"><img src="pic5.jpg"></a></div> 
      <div><a href="#"><img src="pic6.jpg"></a></div> 
     </div> 

この

は私がフェードアウトとフェードイン機能を使用し、これはjsのコードでCSSコード

#wrapper-banner { 
    width: 909px; 
    margin: 0 auto; 
    margin-top: 0px; 
    -ms-transform: translate(0, -49px); 
    /* IE 9 */ 
    -webkit-transform: translate(0px, -49px); 
    /* Safari */ 
    transform: translate(0px, -49px); 
    /* Standard syntax */ 
    border: 1px solid white; 
    border-top-color: #e99f2e; 
    height: 443px; 
    overflow: hidden; 
} 

#wrapper-banner img { 
    clear: both; 
    display: block; 
    margin: auto; 
    width: 908px; 
    height: 441px; 
} 

です。

$("#wrapper-banner > div:gt(0)").hide(); 


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

でも最初の絵かもしれ恐れhide.I'mませんが私を助けることができる私のCSS.Any本体に問題があるのですか？ありがとうございました！

Answer 1

$("#wrapper-banner > div:gt(0)").hide(); 
 

 

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

#wrapper-banner { 
 
    width: 909px; 
 
    margin: 0 auto; 
 
    margin-top: 0px; 
 
    -ms-transform: translate(0, -49px); 
 
    /* IE 9 */ 
 
    -webkit-transform: translate(0px, -49px); 
 
    /* Safari */ 
 
    transform: translate(0px, -49px); 
 
    /* Standard syntax */ 
 
    border: 1px solid white; 
 
    border-top-color: #e99f2e; 
 
    height: 443px; 
 
    overflow: hidden; 
 
} 
 

 
#wrapper-banner img { 
 
    clear: both; 
 
    display: block; 
 
    margin: auto; 
 
    width: 908px; 
 
    height: 441px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="wrapper-banner"> 
 
    <div class="alive"> 
 
    <a href="#"><img src="http://assets.pokemon.com/static2/_ui/img/chrome/external_link_bumper.png"></a> 
 
    </div> 
 
    <div> 
 
    <a href="#"><img src="http://www.pokemon-sunmoon.com/media/uploads/nov_14_assets/promos/promo-3-distro-pokemon-400x240.png"></a> 
 
    </div> 
 
    <div> 
 
    <a href="#"><img src="http://files.onset.freedom.com/ocregister/news/2016/focus/pokemon071416/pik.jpg"></a> 
 
    </div> 
 
    <div> 
 
    <a href="#"><img src="https://heidi.community.uaf.edu/files/2015/04/Pokemon_Icons_by_d4rkbl4de.jpg"></a> 
 
    </div> 
 
    <div> 
 
    <a href="#"><img src="http://assets.pokemon.com/assets/cms2/img/pokedex/full//739.png"></a> 
 
    </div> 
 
</div>