我试图在每次用户访问网站时随机加载图像.我已经按照一个教程和几个先前的线程来解决这个问题,似乎无法让它发挥作用.图像位于/ images /文件夹中,文件名正确输入到数组中:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" />
<script type="text/javascript">
var images = ['OUT01ari.jpg' 'OUT02adobe.jpg' 'OUT03alife.jpg' 'OUT04chinup.jpg' 'OUT05datenightwinecologne.jpg' 'OUT06officechair.jpg' 'OUT07printer.jpg' 'OUT08whitewall.jpg' 'OUT09umbrella.jpg' 'OUT10converse.jpg' 'OUT11wardrobebar.jpg'];
$('#background').css({'background-image': 'url(images/' + images[Math.floor(Math.random() * images.length)] + ')'});
</script>
然后我进入了页面正文中的div,但无济于事:
<body>
<div ="#background"></div>
<div class="container">
</div>
</body>
我哪里错了？
谢谢.
bec*_*rel 21
定义数组时,数组值之间必须有逗号分隔符.
您还应该有两个单独的脚本元素,一个用于包含jquery,另一个用于代码.
大多数浏览器都应忽略带有src属性的脚本标记的内容.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript" ></script>
<script type="text/javascript">
var images = ['OUT01ari.jpg', 'OUT02adobe.jpg', 'OUT03alife.jpg', 'OUT04chinup.jpg', 'OUT05datenightwinecologne.jpg', 'OUT06officechair.jpg', 'OUT07printer.jpg', 'OUT08whitewall.jpg', 'OUT09umbrella.jpg', 'OUT10converse.jpg', 'OUT11wardrobebar.jpg'];
$('#background').css({'background-image': 'url(images/' + images[Math.floor(Math.random() * images.length)] + ')'});
</script>
如果存在src属性,则该元素必须为空或仅包含与脚本内容限制匹配的脚本文档.
对于我认为的早期版本也是如此.
编辑:
如果您正在使用本地文件系统,请确保将jQuery的URL更改为http://,而不仅仅是//.
此外,通过调用文档就绪,确保在#background元素存在时执行脚本.
此示例甚至可以在本地工作:
<html>
<head>
<style type="text/css">
#background {
position:fixed; left: 0px;
top: 0px; background-size:100%;
width:100%; height:100%;
-webkit-user-select: none; -khtml-user-select: none;
-moz-user-select: none; -o-user-select: none; user-select: none;
z-index:9990;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript" ></script>
<script type="text/javascript">
$(function() {
var images = ['OUT01ari.jpg', 'OUT02adobe.jpg', 'OUT03alife.jpg', 'OUT04chinup.jpg', 'OUT05datenightwinecologne.jpg', 'OUT06officechair.jpg', 'OUT07printer.jpg', 'OUT08whitewall.jpg', 'OUT09umbrella.jpg', 'OUT10converse.jpg', 'OUT11wardrobebar.jpg'];
$('#background').css({'background-image': 'url(images/' + images[Math.floor(Math.random() * images.length)] + ')'});
});
</script>
</head>
<body>
<div id="background"></div>
<div class="container">
</div>
</body>
</html>