0

E ae pessoal, tudo bem? Pessoal, estou com um probleminha, tenho um evento JQuery scroll(), só que estou com problema de compatibilidade com o Microsoft Edge (IE), segue o código:

$(window).scroll(function(){
    var scrollTop = $('html, body').scrollTop();

    if(scrollTop >= 40){
        $('.header-menu').css('position', 'fixed');
        $('.header-menu').css('top', '0');
        $('.header-menu').css('left', '0');
        $('.header-menu').css('right', '0');
    }else if(scrollTop <= 40){
        $('.header-menu').css('position', 'relative');      
    }

    if(scrollTop >= 380){
        $('.sub-menu').css('position', 'fixed');
        $('.sub-menu').css('top', '140px');
        $('.sub-menu').css('right', '40px');
    }else if(scrollTop <= 500){
        $('.sub-menu').css('position', 'absolute');
        $('.sub-menu').css('top', '0');
    }

});

OBS: Testei também naquele navegador semelhante ao Chrome, -Chromium- e também não funcionou... Já troquei também o window por document e Nn funcionou

3
  • mas o que exatamente não funcionou? dá algum erro? 31/07/2018 às 18:45
  • Ops, acabei de verificar, o evento scroll funciona, então o problema está no scrollTop. 31/07/2018 às 18:54
  • se quiser olhar o que pretendo fazer, é só acessar a página ges.rf.gd pelo Chrome. 31/07/2018 às 18:56

1 Resposta 1

1

O $('html, body').scrollTop(); só vai pegar o valor do primeiro que encontrar, como toda página gera as tags html e body (conteudo ou não no source do HTML), ele sempre vai buscar o scrollTop de html

E como no IE provavelmente o scroll não seja no mesmo elemento que é no Firefox e Chrome então deve usar a global window., assim:

 $(window).scrollTop();

Provavelmente assim resolve e até simplifica (e ficará "um pouco mais rápido", já que não precisará chamar diversas vezes o $(...)):

var $w = $(window);

$w.scroll(function(){
    var scrollTop = $w.scrollTop();
    var headermenu = $('.header-menu');
    var submenu = $('.sub-menu');

    if(scrollTop >= 40){
        headermenu.css({
            'position': 'fixed',
            'top': '0',
            'left': '0',
            'right': '0'
        });
    }else if(scrollTop <= 40){
        headermenu.css('position', 'relative');      
    }

    if(scrollTop >= 380){
        submenu.css({
            'position': 'fixed',
            'top': '140px',
            'right': '40px'
        });
    }else if(scrollTop <= 500){
        submenu.css({
            'position': 'absolute',
            'top': '0'
        });
    }

});
1
  • 1
    Justamentee, muitoo obrigado, eu não sabia desse pequeno detalhe, valeu cara 31/07/2018 às 19:28

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .