的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和随机颜色

回答

相关问题