【问题标题】:Random body background-image随机体背景图像
【发布时间】:2012-02-08 07:20:32
【问题描述】:

我在网上尝试了几个教程,但似乎没有一个可以正常工作。我想我想做的很简单:

我需要在页面加载时随机显示 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+'")'));

});

【问题讨论】:

  • 如果您发布一些您尝试使用但不起作用的代码,而不是仅仅要求人们为您编写它,通常是首选。
  • 真的,对不起..忘记附上代码了。
  • 是的,这完全取决于您使用的语言以及如何操作。
  • 发布的代码假定您的图像存储在名为 img 的文件夹中,该文件夹与您的 html 所在的文件夹处于同一级别,位于名为 bg 的子文件夹内。它还假设您的图像被命名为1.jpg2.jpg 等。这一切都是真的吗?

标签: javascript jquery random background document-body


【解决方案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)] + ')'});

应该没问题。

【讨论】:

  • 我的函数应该叫什么?我不习惯 javascript,谢谢。
  • 您不需要调用函数,只需将其放在 jQuery $(document).ready(function() {} 标签内即可。
  • 是的,它有效!我对 jQuery 的脚本链接有问题。我并没有首先链接图书馆。谢谢!
  • 没问题,很高兴能帮上忙。如果可以的话,我将非常感谢您接受的答案!
【解决方案2】:

使用 jQuery:$("body").css("background-image", "url(" + Math.floor(Math.random()*9) + ".jpg)");

这是假设,您的图像命名为 0.jpg 到 8.jpg,并且与您的页面位于同一目录中。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2010-11-27
    • 1970-01-01
    • 2023-04-02
    • 2014-10-12
    • 2013-01-14
    • 2013-06-21
    • 1970-01-01
    相关资源
    最近更新 更多