Load page and scroll automatically to a particular element

Asked

Viewed 25,607 times

2

On a contact page there is in respective order: a banner, map and form.

How can I make sure that when loading the page is automatically scrolled down leaving the beginning of it from the map?

javascript jquery html html5

  • scroll on x or y ? axis how long is scroll bar? it would be easier for you to put the code snippet where you have the scroll and tell where you would like it to be positioned

4 answers

8


In the header, <head></head>, add between the tag <script></script> the following code:

$(document).ready(function() { 
window.location.href='#foo';
});

The method ready() indicates that the script within the function will be executed only when the page is ready with all elements loaded.

That way, you don’t need to put the script at the bottom of the page, as well as being more secure.

Where you want the page to stop scrolling, put:

<a href="#" id="foo"></a>

  • Totally solved my problem, thank you @daniel-Omine

  • Friend, is it possible to use the code above, only with a "soft" effect? Type it goes sliding to the element. Instead of appearing "at once" on the screen.

  • @Pauloh.Hartmann, ask a new question, specific to what you need.

1

You can use the page ID itself as a reference to use as anchor Example: But # is required in Java window.location.href='#idDaPagina';

1

an example would be window.scrollTo(0, 10); as I know nothing about your source code, what gives p/ respond would be this.

0

You can wear an anchor:

place at the end of your page this code

<script>
window.location.href='#ancora';
</script>

and now put a field <a href="#" id="ancora"> below the use div or html element.

Browser other questions tagged javascript jquery html html5

You are not signed in. Login or sign up in order to post.