将图像定位在随机位置 [英] Positioning images in random places

问题描述

我想将随机图像放在屏幕的随机位置。我试过这个：

I want to position random images in random places of the screen. I tried this:

$(document).ready(showLetter);
var imgsArray = ["A1", "C1", "F1", "J1", "K1", "L1", "S1", "Ñ1"];

function generateRandomForArray() {
    var num = Math.floor(Math.random() * 8);
    return num;
}

function generateRandom() {
    var num = Math.floor(Math.random() * 400);
    return num;
}

function showLetter() {
    var letter = imgsArray[generateRandomForArray()];
    $("div").append("<img src='imgs/" + letter + ".png'>");
    var left = generateRandom();
    var top = generateRandom();
    $("div").last().css({"top": top + "px", "left": left + "px"});
}

图像显示在屏幕的左上角。再一次：我想把它们放在屏幕的随机位置。我对CSS知之甚少。有任何想法吗？提前致谢！

The images appear on top left of the screen. Once again: I want to position them in random places of the screen. I don't know much about CSS. Any ideas? Thanks in advance!

推荐答案

听起来像是我的定位问题。试试这样，即我添加 position：absolute

Sounds like positioning issue for me. Try like this, i.e., I added position:absolute

function showLetter() {
    var letter = imgsArray[generateRandomForArray()];
    $("div").append("<img src='GameHTML5/images/" + letter + ".png'>");
    var left = generateRandom();
    var top = generateRandom();
    $("div").last().css({"position":"absolute","top": top + "px", "left": left + "px"});
}

这篇关于将图像定位在随机位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！