CODEWITHSUNDEEP
htmlcssanimationslideshow
maxmijn
maxmijn

Reputation: 347

Pause css animation

I made a slideshow in html and css and I want to pause the slideshow when my mouse goes over it. I tried to do this with -webkit-animation-play-state: paused;, but this only pauses 1 image and therefor messes up the slideshow. Is there a way to pause all the images on hover?

http://jsfiddle.net/m3q8pe56/

Upvotes: 4

Views: 720

Answers (1)

Nick
Nick

Reputation: 3281

http://jsfiddle.net/m3q8pe56/1/

#slideshow:hover .photo {
    -webkit-animation-play-state: paused; 
    animation-play-state: paused; 
}

When you hover #slideshow you will pause all .photo within #slideshow

Upvotes: 8

Related Questions