Исчезать изображения в последовательности - PullRequest
Новая
       5

Исчезать изображения в последовательности

1 голос
/ 08 февраля 2011

То, чего я пытаюсь добиться, - это постепенное затухание изображений, но установить его так, чтобы сначала запускалось, затем следующее, затем следующее, чтобы затемнение происходило подряд.

Здесь ссылка на то, как далеко яполучил.

http://bwnew.users34.interdns.co.uk/

вот мой код работает, но я хочу небольшую паузу, чтобы поток слева направо. 

<script type="text/javascript">
$('#slider img:gt(0)').hide();
$('#slider2 img:gt(0)').hide();
$('#slider3 img:gt(0)').hide();

a=0;
b=0;
c=0;


setInterval(function() {

        $("#slider img").eq(a).fadeOut();
        if(a==$('#slider img').length-1)
            a=0;
        else
            a++;
$("#slider img").eq(a).fadeIn();


$("#slider2 img").eq(b).fadeOut();
        if(b==$('#slider2 img').length-1)
            b=0;
        else
            b++;
$("#slider2 img").eq(b).fadeIn();


$("#slider3 img").eq(c).fadeOut();
        if(c==$('#slider3 img').length-1)
            c=0;
        else
            c++;
$("#slider3 img").eq(c).fadeIn();


}, 3000);

Ответы [ 2 ]

1 голос
/ 08 февраля 2011

Самый простой, но явный: 

$('#slider img').fadeIn(function(){
  $('#slider2 img').fadeIn(function(){
    $('#slider3 img').fadeIn();
  });
});
0 голосов
/ 08 февраля 2011

Отлично, это рабочий код

Просто нужно попытаться избавиться от пустого пространства.

http://bwnew.users34.interdns.co.uk/

<script type="text/javascript">
$('#slider img:gt(0)').hide();
$('#slider2 img:gt(0)').hide();
$('#slider3 img:gt(0)').hide();

a=0;
b=0;
c=0;

setInterval(function() {                 

$("#slider img").eq(a).fadeOut();
        if(a==$('#slider img').length)
            a=0;
        else
            a++;

$("#slider2 img").eq(b).fadeOut();
        if(b==$('#slider2 img').length)
            b=0;
        else
            b++;

$("#slider3 img").eq(c).fadeOut();
        if(c==$('#slider3 img').length)
            c=0;
        else
            c++;

$("#slider img").eq(a).fadeIn(function(){
  $("#slider2 img").eq(b).fadeIn(function(){
    $("#slider3 img").eq(c).fadeIn();
  });
}); 


}, 3000);


</script>
...