Very light and simple script to add a top return button on your website.
Add dependencies in your <head></head>
// animated.css
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
// font-awesome
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">Add the script just before the body close tag
<script src="TTP.js"></script>Launch the library with parameters
<script type="text/javascript">
ttp(
"circle", // box shape
"black", // box color
"fas fa-angle-up", // icon class (fontawesome)
"white", // icon color
"bounceIn", // box apparition animation name (animate.css)
"fadeInUp", // icon apparition animation name (animate.css)
);
</script>| box shape | icon & box color format |
|---|---|
| Square | #A9347E (hexadecimal) |
| Circle | rgb(169, 52, 126) (RGB) |
| Triangle | rgba(169, 52, 126, .75) (RGBA) |
| black (color name) |
| icon & box animations | icons |
|---|---|
| select animation class on animate.css | select icon class on fontawesome |