随机页面背景图片

Question

我在网上尝试了几个教程，但似乎都不能正常工作。我想做的事情相当简单：

我有9张不同的 .jpg 图像，需要在页面加载时随机显示为背景。这应该很简单，对吧？

谢谢！

编辑（抱歉，忘记附上代码了 - 在网上找到）：

$(document).ready(function(){

    bgImageTotal=9;

    randomNumber = Math.round(Math.random()*(bgImageTotal-1))+1;

    imgPath=('../img/bg/'+randomNumber+'.jpg');

    $('body').css('background-image', ('url("'+imgPath+'")'));

});

- asirgado

---

通常情况下，我们更喜欢您发布一些您尝试过但无法正常工作的代码，而不是仅仅要求别人为您编写代码。 - James Montagne

对不起，我忘记附上代码了。 - asirgado

是的，这完全取决于你使用的编程语言来确定如何实现它。 - Paul

相关：如何使用一组ID生成随机ID以在页面加载时为body标签设置 - Rob W

发布的代码假定您的图像存储在名为 img 的文件夹中，该文件夹与包含 HTML 文件夹位于同一级别下，其中包含名为 bg 的子文件夹。 它还假定您的图像命名为 1.jpg，2.jpg 等。 这是全部正确的吗？ - James Montagne

Answer 1

看一下这个教程：http://briancray.com/2009/12/28/simple-image-randomizer-jquery/

首先创建一个图片数组：

var images = ['image1.jpg', 'image2.jpg', 'image3.jpg', 'image4.jpg', 'image5.jpg'];

接下来，将一张随机图片设置为背景图像：

$('body').css({'background-image': 'url(images/' + images[Math.floor(Math.random() *      images.length)] + ')'});

那应该没有问题。

- Jesse Pollak

---

我应该给我的函数起什么名字呢？我不太熟悉JavaScript，谢谢。 - asirgado

你不需要调用一个函数，只需将其放在jQuery $(document).ready(function() {} 标签内即可。 - Jesse Pollak

是的，它有效！我遇到了一个与jQuery脚本链接相关的问题。我一开始没有将库链接起来。谢谢！ - asirgado

没问题，很高兴能帮到你。如果可以的话，我非常感谢您采纳我的答案！ - Jesse Pollak

Answer 2

使用jQuery：$("body").css("background-image", "url(" + Math.floor(Math.random()*9) + ".jpg)"); 假设您的图像命名为0.jpg到8.jpg，并且与您的页面位于同一目录中。

- ChrisiPK