Swiper Slider
Overview:
Improvement of Swiper.JS slider's UX through custom JS.
Problem:
Most of developers who have been using swiper for a while try to make it fancy & well animated... and who can blame them? After all, animations sell. This, however, can be detrimental to your site's conversions, as when your site is animating, your visitor's attention is taken away from the things that actually matter – the content.
Solution:
Instead of making everything animated all the time, every time the user performs an action, it is better to limit the animations to be run only once, when the user first interacts with them.
Specifics:
While you can do a lot of damage with swiper.js & custom css, you can't have a slide fade in only the first time the user sees it by using either of these technologies. Crossfade animation works only when you have 1 slide per view & ".class{opacity:0;} .class.active{opacity:1;}" works for each interaction. I used custom JS to fix that issue.