Fala pessoal.
Estou com o seguinte problema, tenho um código que identifica quando ocorreu um scroll da página para poder subir o meu menu lateral ao ser realizado um scroll. Funciona no IE e no FireFox porém não funciona no Chrome.
Segue o exemplo de código.
<script type="text/javascript">
$(document).ready(function () {
var $body = $('body');
var $pagiSidebar = $('.page-sidebar');
$body.scroll(function (event) {
console.log('scrolled $(body).scrollTop() = ' + $('body').scrollTop());
console.log('scrolled $(document).scrollTop() = ' + $(document).scrollTop());
console.log('scrolled $(window).scrollTop() = ' + $(window).scrollTop());
console.log('scrolled $(html).scrollTop() = ' + $('html').scrollTop());
console.log('scrolled $(html, body).scrollTop() = ' + $('html, body').scrollTop());
console.log('scrolled $(html, body, document).scrollTop() = ' + $('html, body, document').scrollTop());
if ($body.scrollTop() > 47) {
$pagiSidebar.addClass('top-zero');
}
else {
$pagiSidebar.removeClass('top-zero');
}
});
});
</script>
Com isso obtive os seguintes resultados.
Firefox e IE =
scrolled $(body).scrollTop() = 270
scrolled $(document).scrollTop() = 0
scrolled $(window).scrollTop() = 0
scrolled $('html').scrollTop() = 0
scrolled $('html, body').scrollTop() = 0
scrolled $('html, body', document).scrollTop() = 0
Chrome =
scrolled $(body).scrollTop() = 0
scrolled $(document).scrollTop() = 0
scrolled $(window).scrollTop() = 0
scrolled $('html').scrollTop() = 0
scrolled $('html, body').scrollTop() = 0
scrolled $('html, body', document).scrollTop() = 0
Alguém sabe o porque disso ou se existe outra maneira de conseguir esse mesmo resultado sem usar o scrollTop ?
Solução
Galera, após explorar um pouco mais e analisar as sugestões cheguei na seguinte solução.
<script type="text/javascript">
$(document).ready(function () {
var $body = $('body');
var $pageSidebar = $('.page-sidebar');
var $pageContainer = $('.page-container');
$body.scroll(function (event) {
if ($pageContainer.offset().top > 0) {
$pageSidebar.css("top", $pageContainer.offset().top + "px");
} else {
$pageSidebar.css("top", "0px");
}
});
});
</script>
Desisti do uso do scrollTop() pois estava apresentando um comportamento muito instável o que não é bom para aplicação.
Valeu a todos!
window.scrollY
, além disso o correto é atribuir o eventoscroll
ao elementowindow
window.scrollY
também fica retornando0
.