JavaScript尝试交替使用backgroundImage

时间:2016-04-01 22:57:27

标签: javascript html css

我试图让背景图像交替出现。它以前工作但现在有些事情发生了。现在背景与CSS设置的背景相同,我想改变它以交替它。



var widthOfBrowser = window.innerWidth;
var heightOfBrowser = window.innerHeight;
var hideImage;
var timeInterval = 20000;
var time = 5000;
var changeNavBar = document.getElementsByTagName("body")[0];
var T1;
var T2;
var T3;
var intervalMain;
var text;
var parent;
var child1;
var child2;
var valueHidePadding;
var mobileTwo;
var desktopView;
var obj3;
var obj1;
var obj2;

if (widthOfBrowser < 500) {
  hideImage = document.getElementsByTagName("body")[0];
  hideImage.style.backgroundImage = "url('')";
  parent = document.getElementById("parent");
  child1 = document.getElementById("removeMobile1");
  child2 = document.getElementById("removeMobile2");
  parent.removeChild(child1);
  parent.removeChild(child2);
} else {
  intervalMain = setInterval(function() {
    putTogether()
  }, timeInterval);

  function putTogether() {
    T1 = setTimeout(function() {
      image1()
    }, time); //after 5 seconds the function alternatingImages1to2 will be executed
    time += 5000;
    T2 = setTimeout(function() {
      image2()
    }, time); //after 10 seconds the function alternatingImages2to3 will be executed
    time += 10000;
    T3 = setTimeout(function() {
      image3()
    }, time);
    time = 5000;

  }

}

function image1() {
  obj1 = document.getElementsByTagName("body")[0];
  obj1 = obj1.style.backgroundImage = "url('')";
}

function image2() {

  obj2 = document.getElementsByTagName("body")[0];
  obj2 = obj2.style.backgroundImage = "url('')"; //placeholder img


}

function image3() {
  obj3 = document.getElementsByTagName("body")[0];
  obj3 = obj3.style.backgroundImage = "url('')"; //placeholder image
}

// Related css
&#13;
body {
  background: url("https://c1.staticflickr.com/1/126/387606063_408c203f6c_b.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  /* This is to set the background */
}
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您似乎忘了添加图片网址:

obj1.style.backgroundImage = "url('')"

应该是:

obj1.style.backgroundImage = "url('path/to/image.jpg')"