css 如何实现随机背景图?

html-css024

css 如何实现随机背景图?,第1张

css只负责静态样式,无法做任何逻辑运算,如果需要随机背景,需要js配合使用

// 首先,定义一个数组,用于存放所有的背景图片

var arr = new Array()

// 将所有背景图放入arr内

arr.push('背景图地址', '背景图地址', '背景图地址')

// 随机获得一个键值

var bg = Math.floor((Math.random() * arr.length))

// 将背景图片放入body的css中

$('body').css('background-image', arr[bg])

首先 写多个背景的class

比如

.imgA {background: url(demo1.jpg) no-repeat}

.imgB {background: url(demo2.jpg) no-repeat}

....

然后在需要切换背景的层上用js替换class就行