Hello.
I have a glitch effect based on a codepen source, but it is only on hover and I need have it continuously - with or without hover.
glitch - hover.zip (44.5 KB)
I am aware that I often receive your great help and I would greatly appreciate your support also for this solution.
Thank you.
(Sorry, I am not finding now the original source on codepen but I will come back with an update to the post.)
BannerMan
(BannerMan)
2
In this part in the css
.l-single-news__image-layer:hover+.l-single-news__image .c-news__image--glitch-effect {
display: block;
animation: 2s infinite alternate glitch-anim-2 linear;
}
Remove the ':hover', so it will be:
.l-single-news__image-layer+.l-single-news__image .c-news__image--glitch-effect {
display: block;
animation: 2s infinite alternate glitch-anim-2 linear;
}
*Edit: And if you want to change it from looping forever, to just 30 seconds for example change the infinite to 15.
.l-single-news__image-layer+.l-single-news__image .c-news__image--glitch-effect {
display: block;
animation: 2s 15 alternate glitch-anim-2 linear;
}
4 Likes
Thank you so much! @BannerMan