Прогресс скроллинга прикручен, но нужно чтобы он начинался не с самого начала скролла, а спустя 900 пикселов. Код как ниже работает, но он спустя 900 px показывает прогресс уже проскролленой страницы, а нужно чтобы начиналось как будто с ноля. Надеюсь понятно изложил. Большое спасибо Елене :)
var bar = $('#bar'),
$window = $(window),
docHeight = $(document).height(),
winHeight = $window.height(),
baseX = docHeight - winHeight;
$(window).scroll(function(){
if($(window).scrollTop() > 900) {
$window.scroll(function(e) {
var x = ($window.scrollTop() / baseX ) * 100;
bar.css({'width': + x + '%'});
});
} else {
return;
}
});
Ответ
Для того чтобы получить необходимый результат нужно немного изменить формулу, а именно ввести в нее сдвиг на необходимое количество px. В результате получим такую формулу:
x = (scroll - shift) / (height - shift) ) * 100
jsFiddle
var bar = $('#bar'),
$window = $(window),
docHeight = $(document).height(),
winHeight = $window.height(),
baseX = docHeight - winHeight,
shift = 900;
$(window).scroll(function(){
if($(window).scrollTop() > shift) {
$window.scroll(function(e) {
var x = (($window.scrollTop() - shift) / (baseX - shift) ) * 100;
bar.css({'width': + x + '%'});
});
} else {
return;
}
});
Комментариев нет:
Отправить комментарий