浏览器刷新的随机全屏背景图像

Question

我使用我在网上找到的这个脚本,每当刷新浏览器时都会有一个随机的背景图像.

CSS

body{ 
background: no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

JS

$(document).ready(function(){
var images=['images/001.jpg',
            'images/002.jpg',
            'images/003.jpg',
            'images/004.jpg',
            'images/005.jpg',];

var randomNumber = Math.floor(Math.random() * images.length);
var bgImg = 'url(' + images[randomNumber] + ')';

$('body').css({'background':bgImg, 'background-size':'cover', });

});

在大于1150像素的屏幕上工作正常,但任何小于此的图像,图像开始堆叠在另一个上面.无论屏幕大小如何,我怎样才能伸展它.我不在乎图像是否在小屏幕上被裁剪,只要它填满了这个地段.

谢谢

Answer 1

像这样

DEMO

JS

$(document).ready(function(){
    var classCycle=['imageCycle1','imageCycle2'];

    var randomNumber = Math.floor(Math.random() * classCycle.length);
    var classToAdd = classCycle[randomNumber];

    $('body').addClass(classToAdd);

});