幻燈片劇烈閃爍

我想爲幻燈片背景寫一些代碼。因爲害怕癲癇發作，請不要看我有超過5秒的時間。如果你能幫助我解決我的問題，那將是美好的。 http://ftp.gigemposters.com 幻燈片劇烈閃爍

<body> 
<div id="background"> 
<div class="bg hidden"><img src="images/bg01.jpg"></div> 
<div class="bg hidden"><img src="images/bg02.jpg"></div> 
<div class="bg hidden"><img src="images/bg03.jpg"></div> 
<div class="bg hidden"><img src="images/bg04.jpg"></div> 
<div class="bg hidden"><img src="images/bg05.jpg"></div> 
</div> 
<script type="text/javascript"> 
$(function(){ 
    $('#background').each(function(){ 
     var $imgArray = $(this).children(); 
     $imgArray.eq(Math.floor(Math.random()*$imgArray.length)).switchClass('hidden','visible',0); 
    }); 
    setInterval(function(){changeImage();},5000) 
    function changeImage(){ 
     $("div").each(function(){ 
      if($('div').hasClass('visible')){ 
       $('div').switchClass('visible','hidden'); 
       $('div.visible').next('div').switchClass('hidden','visible');     
      }; 
      if($('div:last').hasClass('visible')){ 
       $('div:last').switchClass('visible','hidden'); 
       $('.bg:first').switchClass('hidden','visible');     
      }; 
     }); 
    }; 
});

的CSS：

*{margin:0; padding:0;} 
body{} 
.bg img{min-height:100%; min-width:1024px; width:100%; height:auto; position:fixed; top:0; left:0;} 
@media screen and (max-width: 1024px) { .bg img{left: 50%; margin-left:-512px;} } 
.hidden{visibility:hidden;} 
.visible{visibility:visible;}

來源

2011-06-02 jaruesink

我已經更新了我的答案 – grc 2011-06-02 09:21:36

編輯：

此代碼應工作：

$(function(){ 
    $('#background').each(function(){ 
     var $imgArray = $(this).children(); 
     $imgArray.eq(Math.floor(Math.random()*$imgArray.length)).switchClass('hidden','visible',0); 
    }); 

    setInterval(function(){changeImage();},5000); 

    function changeImage() { 
     if($('.bg:last').hasClass('visible')) { 
      $('.bg:last').switchClass('visible','hidden'); 
      $('.bg:first').switchClass('hidden','visible'); 
     } else { 
      $('.visible').next('.hidden').switchClass('hidden','visible'); 
      $('.visible:first').switchClass('visible','hidden'); 
     } 
    } 
});

來源

2011-06-02 08:02:18 grc

幻燈片劇烈閃爍

回答

相關問題