Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как добавить плавный переход (https://javascript.ru/forum/jquery/39377-kak-dobavit-plavnyjj-perekhod.html)

DarAmal 27.06.2013 14:59

Как добавить плавный переход
 
Приветствую всех!
Друзья есть скрипт, который меняет фон сайта, но меняет уж больно резко. Хотелось бы увидеть плавный переход на другой фон.
Подскажите, пожалуйста, что добавить в этот скрипт, что бы осуществить идею?
Код:

jQuery(function(){
        jQuery("#header_scroller").scrollable({circular: true}).autoscroll({interval: 5000});
        jQuery("#client_scroller").scrollable({circular: true});
        jQuery('input[title]').inputHints();
        jQuery('textarea[title]').inputHints();
       
        var api = jQuery("#header_scroller").data("scrollable");
       
        api.onSeek(function(e, i) {                       
                i = i+1;               
                jQuery("ul.indexbg li").removeClass("active");
                jQuery("#bg0"+i).addClass("active");
        });
       
});

пытался вставлять .fadeIn(2000);, но никак не помогает.

Спасибо за любую информацию!

animhotep 27.06.2013 15:08

а где собсна тот скрипт который меняет?

рони 27.06.2013 15:09

DarAmal,
подскажите а где в скрипте строчка которая меняет фон страницы?

рони 27.06.2013 15:23

DarAmal,
:-?
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/color/jquery.color-2.1.1.min.js"></script>
</head>
<body>
<script>
function go()
{
var  t=Math.ceil(Math.random()*16777214)
jQuery("body").animate({
      backgroundColor: "#"+t.toString(16)
  }, 2000, go );
}
go()
</script>
</body>
</html>

DarAmal 27.06.2013 15:26

то что привел на верху, это тот скрипт.
фон дан в css и периодически меняет в #bg

DarAmal 27.06.2013 15:32

собственно вот эти фоны он меняет из css:
body.inner { background:url(../images/bg_top_red.jpg) 50% 0 no-repeat; }

ul.indexbg { position:absolute; left:0; top:0; width:100%; height:500px; list-style:none; margin:0px; padding:0px; z-index:1;
}
ul.indexbg li{ display:none; position:absolute; left:0; top:0; width:100%; height:570px; }
ul.indexbg li#bg01 { background:#fff url(../images/bg_main_top_red.jpg) 50% 0 no-repeat;}
ul.indexbg li#bg02 {	background:#fff url(../images/bg_main_top_black.jpg) 50% 0 no-repeat;  }
ul.indexbg li#bg03 { background:#fff url(../images/bg_main_top_blue.jpg) 50% 0 no-repeat; }
ul.indexbg li.active{ display:block; z-index:2; }
ul.indexbg li.active2{ z-index:3; }

animhotep 27.06.2013 15:48

"#bg0"+i это на 99 картинок, запасливо однако))

DarAmal 27.06.2013 15:58

вот нужно плавный переход типа Fade добавить.
Подскажите пожалуйста, как это сделать в данном коде.

DarAmal 27.06.2013 15:59

кстати, вот собственно то, как данный скрипт работает:
http://service.fg-group.tj/

animhotep 27.06.2013 16:04

у вас там скрипт в бесконечном цикле подгружается


Часовой пояс GMT +3, время: 19:27.