javascript - 正文背景图片不能全屏

Question

我的 body 背景图像有问题，我尝试了任何方法让它全屏显示图像，但我无法修复它。你能帮帮我吗？这是代码。

var body = $('body');
var backgrounds = ['url(images/3.jpg)', 'url(images/4.jpg)', 'url(images/5.jpg)'];
var current = 0;

function nextBackground() {
  body.css('background', backgrounds[current = ++current % backgrounds.length]);
  setTimeout(nextBackground, 5000);
}
setTimeout(nextBackground, 5000);
body.css('background', backgrounds[0]);

@charset "utf-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, em, img, strong, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
}
ol, ul html, body {
  height: 100%;
  width: 100%;
  font: normal 12px/1.3 "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
  color: #DDDDDD;
  background-size: 100% 100%;
}
body {
  height: 100%;
  width: 100%;
  -webkit-transition: background 0.8s;
  -moz-transition: background 0.8s;
  -o-transition: background 0.8s;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 1

这是让背景图片覆盖整个父元素的方法:

background-repeat:no-repeat;
background-size:cover;
background-position:center;

并删除 background-size: 100% 规则。