CSS样式效果未应用于第一张幻灯片,但适用于所有其他样式

时间:2018-09-10 16:43:57

标签: javascript jquery html css slider

每张幻灯片都有很酷的元素效果。它适用于除页面加载中的初始幻灯片以外的所有幻灯片

每张幻灯片上的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模板

0 个答案:

没有答案