Scroll down

[MARCELO]

Is it possible to transform a scroll to the top button into a scroll down, starting from this code:

 

 https://www.w3schools.com/code/tryit.asp?filename=FPWUJPO1D0PN

 

I tried to make some changes, but its really far from being the way i wanted it to be,

 

Thanks,

[Ingolme]

Put an element with an id attribute on the page at the point where you want the browser to scroll to.

<div id="destination">Destination</div>

Then put a link that goes to that element:

<a href="#destination">Go to destination</a>

 

[MARCELO]

Ok. I tried to style the link, but i can t take it to middle.

 https://www.w3schools.com/code/tryit.asp?filename=FQ7Q9YP9CY0X

 

Thanks.

[dsonesuk]

Getting nothing but blank html code?

[MARCELO]

sorry?

 

[dsonesuk]

To centre text and inline elements <a>..</a>, it must be within a block element paragraph <p>...</p>, or  <div>...</div> , and that block element must use text-align: center;

OR turn inline element '<a>' then use 'text-align: center;' on that. but note the link will stretch from left to right, unless you give it a specific fixed width, and use margin: 0 auto;

https://www.w3schools.com/code/tryit.asp?filename=FQ7TVLU3G4O9

Edited April 9, 2018 by dsonesuk

[dsonesuk]

9 hours ago, dsonesuk said:

OR turn inline element '<a>' then use 'text-align: center;' on that

OR turn inline element '<a>‘ into block element, using display: block; then...

[MARCELO]

Instead of putting an element with an id attribute on the page at the point where i EXACTLY  want the browser to scroll to, can i specify a distance from this point - up or down - to the browser scroll to?

[dsonesuk]

To specify a distance, you'll have calculate the distance to specific a point, which is usually done to an element with a specific id, then by using JavaScript .scrollTop, so either way you will require and element with id attribute.

[MARCELO]

Ok, thanks!

In the first case, considering the exactly point, how can i add a slide effect, like this:

http://garbiadv.com/#areas_de_atuacao

i tried to search for it here in W3 and even in the templates there isn t this effect.

 

Thanks again.