No fade on initial image

[axelra82]

Couldn't find any way to make the initial image opacity 1. Would be really nice if there was an option to have the initial image show and then fade all images after that.

Great job and thanks for sharing!

EDIT For anyone else looking to do this: Note: initialLoop is used to make sure we only set fade duration on idx 0 once (initially). in constructor:

this.initialLoop = true;
this.fadeInitial = false;

in observedAttributes:

"fade-initial" /* FadeInitial */,

in attributeChangedCallback:

case "fade-initial" /* FadeInitial */:
    this.fadeInitial = newVal === "true" ? true : false;
    break;

change:

wrap.style.animationDuration = `${this.slideDuration}ms, ${this.fadeDuration}ms`;

to

wrap.style.animationDuration = !this.fadeInitial && index === 0 && this.initialLoop ?`${this.slideDuration}ms, 0ms`: `${this.slideDuration}ms, ${this.fadeDuration}ms`; 

and below this._timeout = setTimeout(() => insert(nextIndex, next), this.slideDuration - this.fadeDuration); add:

if(this.initialLoop === true){
    this.initialLoop = false;
}

Then in component (which is now false by default), to fade first image (initially):

fade-initial={true}

[leolabs]

Hey, that's a good idea! Would you mind making a PR for that? We'd be happy to add that option to the library :)