简体   繁体   English

JS中的背景图像样式在ie9中不起作用

[英]Background-image style with JS not working in ie9

I'm working on a site and im having some issues with my slider in IE9. 我在一个网站上工作,即时通讯在IE9中的滑块出现问题。 What I've done is that I've made a div that gets the background image changed every few seconds depending on the img tags within. 我所做的是,我制作了一个div,它根据背景图像中的img标签每隔几秒钟更改一次背景图像。

You can see it in function here: http://diakondk.quine.pil.dk/ 您可以在这里的功能中看到它: http : //diakondk.quine.pil.dk/

It works wonders in most browsers but i cant seem to figure out why its not working in IE9 or how im gonna make it work since im no JS master. 它可以在大多数浏览器中运行,但是我似乎无法弄清楚为什么它不能在IE9中运行,或者由于没有JS大师,我将如何使其工作。

Any suggestions? 有什么建议么?

var slideshow = (function () {
var images = $('.img-slider-wrapper img').map(function() { 
                  return this.src; 
             }).get()
             for(i = 0; i < images.length; i++) {
               $(".selector").append('<div class="dot" data-image="'+i+'" id="dot'+i+'"></div>');
             }
var index = images.length - 1;
var dot = "#dot"+index;
var timer = setTimeout(slideshow, 8000);

  $('.selector .dot').click(function() {
     index = this.dataset.image;
     $(".img-slider-wrapper").css('background-image', 'url(' + images[index] + ')');
     $(".dot.active").removeClass("active");
     dot = "#dot"+index;
     $(dot).addClass("active");
     clearTimeout(timer);
     timer = setTimeout(slideshow, 8000);
  });

  return function () {
    index = (index + 1) % images.length;
    $(".img-slider-wrapper").css('background-image', 'url(' + images[index] + ')');
    $(".dot.active").removeClass("active");
    dot = "#dot"+index;
    $(dot).addClass("active");
    clearTimeout(timer);
    timer = setTimeout(slideshow, 8000);
  }
 }());

 $(document).ready(slideshow);

Your call of setTimeout fails in any browser, but in IE9 with an exception(what stops the further script-execution). 您对setTimeout调用在任何浏览器中都将失败,但在IE9中会发生异常(这将停止进一步的脚本执行)。

It's a matter of time. 这是时间问题。 At the moment when you call 在您致电的那一刻

var timer = setTimeout(slideshow, 8000);

slideshow is undefined , and undefined is not a valid argument for setTimeout . slideshowundefined ,并且undefined不是setTimeout的有效参数。

Wrap the call in a anonymous function: 将调用包装在匿名函数中:

var timer = setTimeout(function(){slideshow();}, 8000); 

The anonymous function will be a valid argument for setTimeout and the contents of this function will be evaluated after 8sec(when slideshow is defined and a function) 匿名函数将是setTimeout的有效参数,并且此函数的内容将在8秒后评估(定义slideshow和函数时)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM