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

您的代码中有一些错误。

$(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 回答
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 回答