1

既知の数の div に対してプロパティを生成したいのですが、どこが間違っていたのかを突き止めることができます。私が今試したことは次のとおりです。

$(document).ready(function(){
   for(var i=1; i<=7; i++)
   {
    var randBottom = Math.ceil(Math.random()*200); 
    var randHeight = Math.ceil(Math.random()*300)+200-randBottom;
    var randWidth = Math.ceil(Math.random()*50)+20;
    var oceanWidth= $("#ocean").css(["width"]);
    var randLeft= Math.ceil(Math.random()*oceanWidth)-randWidth;
     var cssObj = {
        'bottom' : randBottom+'px',
         'height' : randHeight+'px',
         'widht' : randWidth+'px
        };
    $("#bubble"+i).css(cssObj);
   }
});

これは進行中の完全なサンプルです。

4

3 に答える 3

1

コードにはいくつかの問題があります。

  • メソッドを使用しwidthて要素のサイズを取得します。使用すると、幅が数値として得られるのではなく、幅と単位を含む文字列であるcss(["width"])という名前のプロパティを持つオブジェクトが得られます。width{ width: '420px' }
  • のスタイルを含めるのを忘れましたleft。
  • topandleftの代わりにbottomand を指定しleftます。(そのために計算を変更する必要があるかもしれません。)
  • のスペル'width'を間違えまし'widht'た。
  • 左の位置を計算するために乱数を掛ける前に、要素の幅を減算することをお勧めします。そうしないと、負の値が得られます。

これにより、少なくとも要素がどこかに配置されます。

for(var i=1; i<=7; i++)
   {
    var randBottom = Math.ceil(Math.random()*200); 
    var randHeight = Math.ceil(Math.random()*300)+200-randBottom;
    var randWidth = Math.ceil(Math.random()*50)+20;
    var oceanWidth= $("#ocean").width();
    var randLeft= Math.ceil(Math.random()*(oceanWidth-randWidth));
     var cssObj = {
        'left': randLeft + 'px',
        'top' : randBottom+'px',
         'height' : randHeight+'px',
         'width' : randWidth+'px'
        };
       console.log(cssObj);
    $("#bubble"+i).css(cssObj);
   }
于 2013-01-24T08:31:16.580 に答える
1

コードにいくつかのエラーがあります。

$(document).ready(function(){
   for(var i=1; i<=7; i++)
   {
    var randBottom = Math.ceil(Math.random()*200); 
    var randHeight = Math.ceil(Math.random()*300)+200-randBottom;
    var randWidth = Math.ceil(Math.random()*50)+20;
    var oceanWidth= $("#ocean").css(["width"]);
    var randLeft= Math.ceil(Math.random()*oceanWidth)-randWidth;
     var cssObj = {
        'bottom' : randBottom+'px',
         'height' : randHeight+'px',
         'width' : randWidth+'px'
        };
    $("#bubble"+i).css(cssObj);
   }
});
于 2013-01-24T08:18:03.007 に答える
1

css オブジェクトの最後の要素の最後にある ' を忘れています。

var cssObj = 
{
    'bottom' : randBottom + 'px',
    'height' : randHeight + 'px',
    'widht' : randWidth + 'px'
};
于 2013-01-24T08:19:14.520 に答える