| biryukovm |
08.05.2015 08:46 |
Смен картинок с плавным переходом
Здравствуйте Всем, я лазия по форуму нашел код который мне подходит но мне не хватает мягкого перехода между картинками я как понял это делается через "show"
В общем ребя мож подскажите как сделать плавный переход потухания и появления картинки
<a onclick="next()"><img src="/img/H1.jpg" alt="" id="foto" ></a>
var arr = ["H1.jpg", "H2.jpg", "H3.jpg"]; // имена картинок
var path = "/img/"; // каталог, где лежат картинки.
var i = 0 // индекс текущего изображения.
var img = "foto";// id картинки, которая будет меняться
img = document.getElementById(img);
var next = function() {
$("#foto").css("opacity", "0.0").css("transition","1.5s").css("-webkit-transition","1.5s").css("-o-transition","1.5s").css("-moz-transition","1.5s");
img.src = path+arr[i];
i = ++i%arr.length;
//$('#foto').css({opacity: 1.0});
$("#foto").css("opacity", "1.0").css("transition","1.5s").css("-webkit-transition","1.5s").css("-o-transition","1.5s").css("-moz-transition","1.5s");
}
setInterval(function(){next()},8000);
next()
|