Как я могу настроить этот скрипт так, чтобы он отображался поверх другого? - PullRequest
Новая
       6

Как я могу настроить этот скрипт так, чтобы он отображался поверх другого?

1 голос
/ 20 июля 2011

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

function slideSwitch() {
var $active = $('#slideshow IMG.active');

if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

// use this to pull the images in the order they appear in the markup
var $next =  $active.next().length ? $active.next()
    : $('#slideshow IMG:first');

// uncomment the 3 lines below to pull the images in random order

// var $sibs  = $active.siblings();
// var rndNum = Math.floor(Math.random() * $sibs.length );
// var $next  = $( $sibs[ rndNum ] );


$active.addClass('last-active');

$next.css({opacity: 0.0})
    .addClass('active')
    .animate({opacity: 1.0}, 1500, function() {
        $active.removeClass('active last-active');
    });
}

$(function() {
setInterval( "slideSwitch()", 5000 );

});

1 Ответ

1 голос
/ 20 июля 2011

Просто добавьте текстовое изображение в обратном вызове, чтобы оживить следующий слайд: 

$next.css({opacity: 0.0})
    .addClass('active')
    .animate({opacity: 1.0}, 1500, function() {
        // Fade in/out text image here
        $active.removeClass('active last-active');
    });
}
...