的jQuery的slideToggle和隨機顏色

我有一個的jsfiddle這裏來說明我的問題的jQuery的slideToggle和隨機顏色

這只是一個簡單的按鈕，一個隱藏的div。按鈕滑動切換隱藏的div。

我想在每次打開時用div填充隨機顏色。

目前它正在選擇兩種隨機顏色 - 當div打開和完成打開時。

我該如何停止第二種顏色，只有一種。

<!DOCTYPE html> 
    <html> 
     <head> 
     <title>Title of the document</title> 

     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
     <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.4.1/build/cssreset/cssreset-min.css"> 

     <style type="text/css"> 
     •{ 
      margin:0; 
      padding:0; 
     } 
     #wrap{ 
      margin:20px; 
     } 
     #btn{ 
      width:100px; 
      height:50px; 
      background:red; 
      color:white; 
      padding:10px; 
      margin:0 0 50px 0;   
     } 
     #infoDiv{ 
      width:500px; 
      height:300px; 
      display:none; 
     } 
     </style> 

     </head> 

    <body> 

     <div id="wrap"> 

      <a href="#" id="btn">CLICK</a> 

      <div id="infoDiv"> 

      </div>      

     </div> 

     <script> 

     $(document).ready(function(){ 

      alert('here'); 

      var color_arr = ['#6faab6','#80c3d1','#888888','#d8e420','#21b4e4','#e4b115','#33ace4']; 

      $('#infoDiv').hide(); 

      $('#btn').bind('click', function(){ 
       $('#infoDiv').slideToggle('slow', function(){ 
        var ranNum = Math.floor(Math.random()*color_arr.length); 
        var col = color_arr[ranNum]; 
        $('#infoDiv').css({'background': col}); 
       }); 
      });  

     }); 

     </script> 

    </body> 

    </html>

來源

2012-11-08 ttmt

$(document).ready(function(){ 

var color_arr = ['#6faab6','#80c3d1','#888888','#d8e420','#21b4e4','#e4b115','#33ace4']; 

$('#infoDiv').hide(); 

$('#btn').bind('click', function(){ 
    var ranNum = Math.floor(Math.random()*color_arr.length); 
     var col = color_arr[ranNum]; 
    $('#infoDiv:hidden').css({'background': col}); 
    $('#infoDiv').slideToggle('slow'); 
});

}）;

試一下 - 我搬到你隨機顏色選擇器出的slideToggle回調因爲一旦幻燈片結束，將只運行，從你的我的問題假設你不想要。

，如果它通過檢查可見選擇隱藏它也只改變了信息div的顏色，你可以閱讀更多關於here

讓我知道，如果你是這樣的

來源

2012-11-08 11:33:57 Idiot211

這做到了，謝謝Idiot211 – ttmt

不用擔心，樂意幫忙！ – Idiot211

的jQuery的slideToggle和隨機顏色

回答

相關問題