每张幻灯片都有很酷的元素效果。它适用于除页面加载中的初始幻灯片以外的所有幻灯片
每张幻灯片上的css效果具有.pogoSlider-slide-element
类,可在幻灯片上显示信息。它仅在初始幻灯片之后开始。我不知道要在初始幻灯片上强制使用此CSS效果的位置。任何帮助深表感谢。
function h(k, j) {
this.element = k;
this.$element = d(k);
this.settings = d.extend({}, b, j);
this.currentSlideIndex = 0;
this.prevSlideIndex = 0;
this.slideTimeoutId = 0;
this.slides = [];
this.calls = [];
this.paused = false;
this.navigating = false;
this.slideStartTime = null;
this.slideTimeRemaining = 0;
this._init()
}
h.prototype = {
_init: function() {
var k = this;
k.$element.find(".pogoSlider-slide").each(function() {
var n = [];
var o = 0;
d(this).data("original-styles", d(this).attr("style"));
d(this).find(".pogoSlider-slide-element").each(function() {
var p = parseInt(d(this).data("start")) !== a
? d(this).data("start")
: k.settings.elementTransitionStart;
var q = parseInt(d(this).data("duration")) ||
k.settings.elementTransitionDuration;
if ((p + q) > o) {
o = (p + q)
}
n.push({
$element: d(this),
element: this,
startTime: p,
duration: q,
transitionIn: d(this).data("in") ||
k.settings.elementTransitionIn,
transitionOut: d(this).data("out") ||
k.settings.elementTransitionOut
});
d(this).css("opacity", 0)
});
var m = {
$element: d(this),
element: this,
transition: d(this).data("transition") ||
k.settings.slideTransition,
duration: parseInt(d(this).data("duration")) ||
k.settings.slideTransitionDuration,
elementTransitionDuration: o,
totalSlideDuration: k.settings.autoplayTimeout + o,
children: n
};
k.slides.push(m)
});
k.numSlides = k.slides.length;
k.slides[0].$element.css("opacity", 1);
if (k.settings.autoplay && k.settings.displayProgess) {
k._createProgessBar()
}
k.$element.css("padding-bottom", (100 / (k.settings.targetWidth / k.settings.targetHeight)) + "%");
var j = k.$element.find("img").length;
if (j > 0) {
var l = 0;
k.$element.prepend('<div class="pogoSlider-loading"><div class="pogoSlider-loading-icon"></div></div>');
k.$element.find("img").one("load", function() {
if (++l === j) {
d(".pogoSlider-loading").remove();
k._onSliderReady()
}
}).each(function() {
if (this.complete) {
d(this).trigger("load")
}
})
} else {
k._onSliderReady()
}
},
我从w3布局(https://p.w3layouts.com/demos_new/20-01-2017/affluence-demo_Free/635141560/web/index.html)下载了Affluent模板