JS FadeIn не работает в Firefox и IE

Я пытаюсь получить затухающий фоновый рисунок, чтобы работать, но я очень хорошо разбираюсь в JS. Проблема в том, что эффект затухания прекрасно работает в хроме, но изображение просто сдвигается без замирания в Firefox и IE.JS FadeIn не работает в Firefox и IE

Вот мой код:

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script> 
</head> 

<body style="margin:0; padding:0;"> 
<style> 
.bg_img_slider{ 
    min-height:530px; 
    background-image:url("a.jpg"); 
    background-repeat:no-repeat; 
    background-position:center; 
    background-size:cover;} 
</style> 

<script> 
var newBg = [ 
    'b.jpg', 
    'c.jpg', 
    'd.jpg' 
    ]; 
    var i = 0; 
var rotateBg = setInterval(function(){ 
    i++; 
    if(i > 2) 
     i=0; 
    $('.bg_img_slider').css({backgroundImage : 'url(' + newBg[i] + ')'}).fadeIn('slow', 1); 
}, 3000); 
</script> 

<div class="bg_img_slider"></div> 

</body> 
</html>

источник

2015-03-24 Kimdt27

это не 'backgroundImage' ... это' фон-image'. – dowomenfart

Я не вижу причин, почему он должен работать на Chrome. Можете ли вы создать пример jsFiddle.net или фрагмент стека? – j08691

, если вы ожидаете, что fadeIn будет исчезать в фоновом изображении в div, вы ожидаете неправильного поведения. fadeIn заставляет элемент DOM «bg_img_slider» исчезать, он не имеет никакого отношения к фонового изображения CSS. –

Вместо того, чтобы использовать метод Jquery FadeIn(), вы можете использовать CSS3 переходы.

JSFIDDLE DEMO

.bg_img_slider { 
    min-height:530px; 
    background-image:url("http://texy.dk/a.jpg"); 
    background-repeat:no-repeat; 
    background-position:center; 
    background-size:cover; 
    -webkit-transition: background-image .6s ease-in; 
    transition: background-image .6s ease-in; 
}

источник

2015-03-24 16:32:10 dowomenfart

его хороший подход .. спасибо – daremachine

Ваша приветственная игра с легкостью для получения желаемого эффекта @daremachine – dowomenfart

okay , благодаря. Однако это разрешение, похоже, не исчезает в Firefox и IE? – Kimdt27

JS FadeIn не работает в Firefox и IE

ответ

Смежные вопросы