将图像定位在随机位置

Positioning images in random places

本文关键字：随机 位置 定位 图像      更新时间：2023-09-26

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

$(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了解不多。有什么想法吗？提前感谢！

听起来像是定位问题。试着这样做，即我添加了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"});
}

function generateRandomForArray(min, max) {
  var num = Math.random() * (max - min) + min;
  return Math.floor(num);
}
//generateRandomForArray(0, 8);
//3
//generateRandomForArray(0, 8);
//0
//generateRandomForArray(0, 8);
//2
//generateRandomForArray(0, 8);
//4
//generateRandomForArray(0, 8);
//5
//generateRandomForArray(0, 8);
//7
//generateRandomForArray(0, 8);
//4
相关文章：