I have noticed that right before my scroll-to-top animation takes place, the screen flickers.
This can be seen live at: http://www.dreamtheater.co.il
To recreate:
The HTML's body is like so: <body id="top">
.
And the JavaScript (relevant code at the very bottom):
$(function() {
var stickyHeader = $('#menubar').offset().top;
$(window).scroll(function() {
if ($(window).scrollTop() > stickyHeader) {
...
...
$("a[href='http://www.dreamtheater.co.il/index/']").attr('href', '#top');
} else {
...
...
$("a[href='#top']").attr('href', 'http://www.dreamtheater.co.il/index/');
}
});
$('#top').on("click",function() {
$('body,html').animate({ scrollTop: 0 }, 'slow')
});
});
Okay, seems the problem was two-folded:
<body id="top">
instead to the href, which I also dynamically change on scrollIt now works smoothly, with no flickering, like this:
$("#menubar").on("click", "#menu a[href='#top']", function(){
$('body,html').animate({ scrollTop: 0 }, 'slow');
return false;
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With