Я использую jQuery-Plugin-To-Create-Image-Sequence-Animation-On-Scroll-Sequencer.
Проблема в том, что когда я помещаю свои изображения в папку с изображениями, чтобы запустить код, все работает нормально, но не отображается последнее изображение последовательности.
Я пытался изменить файл jQuery, но он все еще не работает.
Вот мой index.html:
<!doctype html>
<html>
<head>
<style>
body{
margin: 0;
padding: 0;
}
div#preload{
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
padding-top: 25%;
background: #f2f2f3;
z-index: 1
}
div#preload h1, div#preload h2{
text-align: center;
}
div#images{
height: 5000px;
z-index: 0;
}
img{
min-height: 110%;
width: auto;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
}
</style>
</head>
<body>
<div id="preload">
<h1>Presentation</h1>
</div>
<div id="images">
<img class="sequencer" src="./images/0.jpg">
</div>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery-sequencer.min.js"></script>
<script>
$("div#images").sequencer({
count: 10,
path: "./images",
ext: "jpg"
}, function() {
$("div#preload").hide();
});
</script>
</body>
</html>
А это мой код jQuery:
! function(t) {
t.fn.sequencer = function(e, n) {
var s, r, o, h, i, u = this,
c = [],
a = 0;
"/" === e.path.substr(-1) && (e.path = e.path.substr(0, e.path.length - 1));
for (var p = 0; p <= e.count; p++) c.push(e.path + "/" + p + "." + e.ext);
return t("<div class='jquery-sequencer-preload'></div>").appendTo("body").css("display", "none"), t(c).each(function() {
t("<img>").attr("src", this).load(function() {
t(this).appendTo("div.jquery-sequencer-preload"), a++, a === c.length && n()
})
}), t(window).scroll(function() {
s = t(u).height(), r = t(this).height(), o = t(this).scrollTop(), h = 100 * o / (s - r), i = Math.round(h / 100 * e.count), i < e.count && t("img.sequencer").attr("src", c[i])
}), this
}
}(jQuery);
Здесь доступна демоверсия, которая показывает мою проблему -
http://axgardi.ir/maimage/.
Как видите, отображается «Глубина 50» - «Глубина 59», а «Глубина 60» не отображается.