CODEWITHSUNDEEP
javascript
JyuTsu
JyuTsu

Reputation: 1

How did they do the effect in the page at http://labs.saurabh-sharma.com/themes/cruz/wp/

How did they do the effect in the page at http://labs.saurabh-sharma.com/themes/cruz/wp/

I am thinking they put a 0% opacity new image above the existing image and slowly increase the opacity to 100% without changing the opacity of the existing image. (so after 100 "ticks" the new image will cover the old image)

Or is it that the opacity of the new image goes from 0 to 100% WHILE the opacity of the old image goes from 100% to 0 simulataneously?

Or is it something else altogether?

Well the effect looks very good, so I'm trying to build something like it and was wondering how did they do it.

Upvotes: 0

Views: 51

Answers (1)

Luke
Luke

Reputation: 1233

Looks like they are using Nivo Slider (http://nivo.dev7studios.com/).

But yes, the actual animation is the old image fading to 0% opacity, with the new image fading in to 100% opacity at the same time.

Upvotes: 1

Related Questions