Archived topic
Add an "appearing animation" to the back-to-top button
3 replies · Started by Christian on October 25, 2016
Hi Tom,
I just added the back to top button to my site and have already themed it a bit more "material" ;)
Now the only thing I miss is some sort of animation to not just make the button "pop in" whenever I scroll down enough.
Is there a way to add this using CSS ? I really would like to not add another plugin...
PS: I hope the beer/coffee was good and thank you again for everything,
Christian
Good question!
The way I currently have it set up doesn't allow for transitions.
I realize that's not ideal, so I just adjusted it to allow them.
You can grab the latest code here: https://github.com/tomusborne/GeneratePress
The files you want to replace are:
https://github.com/tomusborne/GeneratePress/blob/master/inc/template-tags.php
https://github.com/tomusborne/GeneratePress/blob/master/js/back-to-top.min.js
There should be a small transition now by default, but you can make it more prominent like this:
.generate-back-to-top {
transition: opacity 1s ease, visibility 1s ease;
}Thanks for helping me improve the code :)
Hi Tom,
I just had time to implement the changes, everything is working great, thanks !
And please, don't thank me, I have to thank you, as much as every other user of this great heme should be thankful for the theme itself and your precious support. This is rare nowadays.
Have a good time and thanks again,
Christian
Perfect :)
Glad I was able to help!
