javascript – How do I scroll horizontally between pages using a fixed menu?

Question:

This is my HTML code, and I'm also using CSS with position: fixed; on the menu.

Code:

<body>
    <div class="topo">
        <img src="img/logo.png" />
        <div class="menu">
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">Quem Somos</a></li>
                <li><a href="#">Localização</a></li>
                <li><a href="#">Cardápio</a></li>
                <li><a href="#">Promoções</a></li>
                <li><a href="#">Fale Conosco</a></li>
            </ul>
        </div>
        <div style="clear: both;"></div>
    </div>
    <div class="corpo">
        conteudo
    </div>

Answer:

you can use something like:

$(function(){
  $('.menu').find('a').on('click', function(e){
        e.preventDefault();
        $('.corpo').scrollLeft( $(this).data('scroll') );
    })
});

but for this to work you need to add the data-scroll property in the menu links passing a value inside.

see here: http://codepen.io/pen/xRbrNo

Post Views: 0