The Scroll-to-Top button, skin-integrated (exportable) and using Font-Awesome icon instead of an image. Needs the checkbox to be checked in Dynamik Design - Body - Add Support For Font Awesome Icons
// Goes to Dynamik Design - Skins - Your Skin - JS after the comments
jQuery(document).ready(function($) {
//Scroll to top button
$(window).scroll(function(){
if ($(this).scrollTop() > 200) {
$('.up').fadeIn();
} else {
$('.up').fadeOut();
}
});
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, 800);
return false;
});
});
/* -----Scroll to top button, please edit styles to your needs, change placement if you want----- */
a.up{
position:fixed;
bottom:30px;
right:30px;
display:none;
background:#565656;
background:rgba(86,86,86,0.7);
padding:14px 14px 10px;
text-align: center;
margin: 0 0 0 0;
cursor:pointer;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
}
a.up:hover {
background:#AA1233;
background:rgba(170,18,51,1.0);
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
}
a.up .fa {
color:#ffffff;
text-shadow: 1px 1px 0 #cccccc;
font-size:30px;
margin-top:-5px;
margin-left:1px;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
}
//* Add the scroll to top button
//* Goes to Dynamik Design - Skins - Your Skin - PHP after line 45
add_action( 'genesis_before', 'siga_to_top');
function siga_to_top() {
echo '<a href="#top" class="up" title="Back to top"><i class="fa fa-4x fa-angle-up"></i></a>';
}