0

Estou utilizando menu Ancora, e quando clico no link ele fica com o início acima do menu, como faço para que posicione abaixo do menu?

Como fica: inserir a descrição da imagem aqui

Como deveria ficar: inserir a descrição da imagem aqui

código: ´Script´

<script>
    var menu = $('#menu .nav li');
    var sectionPositions = $('section').map(function () {
        return $(this).position().top;
    });
    var sections = $('section');
    $(document).on('scroll', function () {
        var scroll = $(document).scrollTop();
        var currentElement;
        $(sectionPositions).each(function (i) {
            if (scroll > this - 50) currentElement = menu[i];
        });
        currentElement && addClass(currentElement);
    });
    menu.on('click', function () {
        addClass(this);
    });

    function addClass(el) {
        menu.removeClass('active');
        $(el).addClass('active');
    };
</script>

Section

    <section data-slide="4" id="Devices">
        <div class="row">
            <div class="div2 text-center">
                <img class="div2Img" src="~/Content/Images/BackGround/dispositivos.png" />

                <p class="div2Texto">Seu Site ou Software funcionando em qualquer dispositivo</p>
            </div>
        </div>
    </section>

Menu

<li><a href="#Devices">Dispositivos</a></li>
3
  • Comece por fechar a tag section...
    – MagicHat
    Commented 28/12/2016 às 23:58
  • Você pode adicionar alguns pixels em padding-top no seu elemento com a id "devices".
    – lfarroco
    Commented 29/12/2016 às 19:40
  • Tenta mudando a posição do menu pra absolute no css...
    – Brlesskoin
    Commented 1/01/2017 às 2:25

1 Resposta 1

0

Pelo o que vi você está usando menu com position:fixed, para resolver basta adicionar um padding-top no body:

body 
{ 
    padding-top: 60px; // altura do seu menu
}

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 .