Created
November 22, 2016 09:50
-
-
Save arturmamedov/4f10988e5cc9536fe16b4b67b5519559 to your computer and use it in GitHub Desktop.
To top JS and HTML
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- 1 --> | |
<a href="#" id="totop">TOP</a> | |
<script> | |
if ($('#totop').length) { | |
var scrollTrigger = 100, // px | |
backToTop = function () { | |
var scrollTop = $(window).scrollTop(); | |
if (scrollTop > scrollTrigger) { | |
$('#totop').addClass('show'); | |
} else { | |
$('#totop').removeClass('show'); | |
} | |
}; | |
backToTop(); | |
$(window).on('scroll', function () { | |
backToTop(); | |
}); | |
$('#totop').on('click', function (e) { | |
e.preventDefault(); | |
$('html,body').animate({ | |
scrollTop: 0 | |
}, 700); | |
}); | |
} | |
</script> | |
<!-- 2 --> | |
<div class="go2top"> | |
<i class="fa fa-chevron-up"></i> | |
</div> | |
<script> | |
var LayoutGo2Top = function () { | |
var handle = function () { | |
var currentWindowPosition = $(window).scrollTop(); // current vertical position | |
if (currentWindowPosition > 300) { | |
$(".go2top").show(); | |
} else { | |
$(".go2top").hide(); | |
} | |
}; | |
return { | |
//main function to initiate the module | |
init: function () { | |
handle(); // call headerFix() when the page was loaded | |
if (navigator.userAgent.match(/iPhone|iPad|iPod/i)) { | |
$(window).bind("touchend touchcancel touchleave", function (e) { | |
handle(); | |
}); | |
} else { | |
$(window).scroll(function () { | |
handle(); | |
}); | |
} | |
$(".go2top").on('click', function (e) { | |
e.preventDefault(); | |
$("html, body").animate({ | |
scrollTop: 0 | |
}, 600); | |
}); | |
} | |
}; | |
}(); | |
LayoutGo2Top.init(); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I personally adopt the second one in https://github.com/arturmamedov/withfront