I have made a function wich runs on the computer very well. But on mobiles the position refreshes only when the scrolling stops. Its a known problem and i found answers but I didnt get it in my function working. Maybe one of you can help me.
my function:
$(window).scroll(function () {
if ($(window).scrollTop() >600) {
$('#logo').css('position', "fixed");
$('#logo').css('top', 0);
}
else if($(window).scrollTop() < 600) {
$('#logo').css('position', "relative");
$('#logo').css('top', 600)
}
});
and in the internet i found this which i should replace in my function:
$('body').on({
'touchmove': function(e) {
console.log($(this).scrollTop()); // Replace this with your code.
}
});
or this:
$('body').bind('touchmove', function(e) {
console.log($(this).scrollTop()); // Replace this with your code.
});
It would be nice if someone could rewrite my function so that it works smoothly on mobiles.
I explain shortly what this function do. When you load my page there is a blackscreen with a headline in the middle of the screen. Nothing else. when you scroll down the title should move up normaly until he reaches the top. when it reaches the top it gets the "position: fixed" attribute. when you scroll up it gets the "position: relative" attribute again. Nothing else should happen. But on mobiles the text scrolls up until the scrolling stops (most of the time you scroll the text out of the screen) and pop up on the fixed position. But when it is fixed everything is ok and it stands there.