將元素放置在隨機位置

我試圖用這段代碼將元素放置在隨機位置，但它只是將元素放置在我的容器元素的頂部。我究竟做錯了什麼？將元素放置在隨機位置

create: function(){ 

    console.log("cone created"); 

    var el = document.createElement('div'); 
    el.classList.add('cone'); 

    this.container.appendChild(el); 

    this.el = el; 

    this.x = Math.random() * canvas.innerWidth + 'px'; 
    this.y = Math.random() * canvas.innerHeight + 'px'; 

    },

來源

2013-01-13 Frank Kluytmans

實際上用'this.x'和'this.y'做些什麼的代碼在哪裏？ –

也許插入div與內聯的CSS可以處理這個。

我寫了一個例子：

$(document).ready(function() { 
    var sqrPixel = 10; 

    var posX = 30; 
    var posY = 100; 

    $('body').append('<div style="background: #ccc; box-shadow: 2px 2px 2px #000; position: absolute; width: ' + sqrPixel + 'px; height: ' + sqrPixel + 'px; left: ' + posX + '; top: ' + posY + ';"></div>'); 
});

我的平方追加到body。如果你想改變它。您可以隨機設置posX和posY。

我知道它看起來有點混亂，但至少它對我有用。

來源

2013-01-13 19:34:44 pilavust

我假設「帆布」不是真的帆布，它只是一個<div>。

在這種情況下，你需要做的幾件事情：

確保您的容器具有position:relative
確保你的容器的孩子有position:absolute
添加el.style.left = this.x; el.style.top = this.y;實際位置的元素

來源

2013-01-13 19:04:11

將元素放置在隨機位置

回答

相關問題