Hello, how can I develop a way to take the user up to a certain length of the page when I click on a link!
Example:
<div class="roupas"> </div>
<div class="bolsas"> </div>
<div class="calçados"> </div>
<a>Roupas</a>
By clicking the link the person goes to clothes div
Thank you in advance!
Is this it? See the data attributes
$('[data-vestuario]').on('click', function() {
var seccao = $(this).data('vestuario');
$('html, body').animate({
scrollTop: $(seccao).offset().top, // animar pag até à distancia entre a secção correspondente e o topo da página
});
});span {
display:inline-block;
margin: 0 30px;
color: red;
}
div {
height: 600px; /* Isto é só pelo exemplo, não aconselho a usar isto num proj real */
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><spandata-vestuario="#roupas">Roupas</span>
<span data-vestuario="#sapatos">Sapatos</span>
<span data-vestuario="#cuecas">Cuecas</span>
<div id="roupas">
Secção das roupas
</div>
<div id="sapatos">
Secção das sapatos
</div>
<div id="cuecas">
Secção das cuecas
</div>Hello. You could use the scroolspy component of Boostrap. See Documentation