0
Пожалуйста, смотрите эту скрипку http://jsfiddle.net/rabelais/ayaK2/Увядание изображений в слайд-шоу?
Вот слайд-шоу из фотографий и видео.
Все изображения и видеоролики - полный экран.
Когда пользователь нажимает на каждое изображение/видео, он отображает следующий.
МОЙ ВОПРОС: Как заставить изображения в этом слайд-шоу исчезать?
$(function() {
var win = $(window),
fullscreen = $('.full'),
image = fullscreen.find('img, video'),
imageWidth = image.width(),
imageHeight = image.height(),
imageRatio = imageWidth/imageHeight,
currentSlide = 0,
numSlides = $('.full').length;
function resizeImage() {
var winWidth = win.width(),
winHeight = win.height(),
winRatio = winWidth/winHeight;
if (winRatio > imageRatio) {
image.css({
width: winWidth,
height: Math.round(winWidth/imageRatio)
});
} else {
image.css({
width: Math.round(winHeight * imageRatio),
height: winHeight
});
}
}
function advanceToSlide(slidePos){
slide = $('.full').eq(slidePos);
slide.show();
var video = $('video', slide);
$('video').each(function(){
$(this).get(0).pause();
})
if(video.length){
console.log(video.get(0).play());
}
}
$('.full').on('click', function(){
$('.full').hide();
if(currentSlide < numSlides - 1){
currentSlide = currentSlide + 1;
} else{
currentSlide = 0;
}
advanceToSlide(currentSlide);
});
$('.full:gt(0)').hide();
resizeImage();
});