使用 Math.random() 和 .css 的 jQuery/JS 随机图像定位？答案

【问题标题】：jQuery/JS random image positioning using Math.random() and .css?使用 Math.random() 和 .css 的 jQuery/JS 随机图像定位？
【发布时间】：2012-08-31 09:25:04
【问题描述】：

我是编程新手。现在我正在使用 jQuery + jqueryrotate 随机旋转我的图像，所以看起来它们是分散的。我设法让它们随机旋转，但我对如何使位置随机化有点困惑。我在position: relative div 中制作了所有图像position: absolute，类为.holder。我知道通常使用 jquery 的 css 属性通常应该是 ({"top": "4px"}) 但我希望当我将它包裹在 toString 函数周围时它不起作用。

$.each($('.holder img'), function (i, element) {
    $(element).rotate(Math.random() * -90 + Math.random() * 90);
    $(element).css({
        "top": Math.random() * 300;
    })
});

【问题讨论】：

标签： javascript jquery

【解决方案1】：

没有单元顶不明白你的意思，试试这个：

$.each($('.holder img'), function(i, element){
    $(element).rotate(Math.random() * -90 + Math.random() * 90);
    $(element).css({
        "top": (Math.random() * 300) + "px"
    })
});

【讨论】：

感谢秘银。运作良好。但是您能解释一下为什么不必将 (Math.random() * 300) 转换为字符串吗？我认为在 JS 中“+”运算符只会将两者连接起来，因为其中一个（在本例中为“px”）是一个字符串

【解决方案2】：

$(element).css({
    "top": Math.random() * 300;
});

应该

$(element).css({
    "top": Math.random() * 300
});

删除 ; 否则会触发 sintax 错误。

【讨论】：

【解决方案3】：

您只需在top 属性的CSS 值末尾添加+ "px"

$(element).css({
    "top": (Math.random () * 300) + "px"
});

【讨论】：