1

私の質問を説明するために、ここにjsfiddleがあります

http://jsfiddle.net/ttmt/DgnLd/1/

これは、非表示の div を持つ単純なボタンです。ボタン スライドは、非表示の div を切り替えます。

開くたびに div をランダムな色で塗りつぶしたいと思います。

現時点では、div が開いているときと開いているときの 2 つのランダムな色を選択しています。

どうすれば2番目の色を止めて1色だけにすることができますか.

    <!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>
4

1 に答える 1

1 
$(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');
});

}）; </ p>

試してみてください-ランダムカラーピッカーをSlideToggleコールバックから移動しました。これは、スライドが終了したときにのみ実行されるためです。これは、あなたの質問から、あなたが望まないと思ったものです。

また、表示されているセレクターをチェックして非表示になっている場合にのみ、情報divの色を変更します。詳細については、こちらをご覧ください。

それがあなたのために働くかどうか私に知らせてください

于 2012-11-08T11:33:57.267 に答える