...

View Full Version : Go to the top of the page.



effpeetee
05-31-2009, 07:17 PM
How do I jump to the top of a page from the bottom of the same page.

I used to know, but my leaky memory has let it get away.:o

Frank

Excavator
05-31-2009, 07:30 PM
Hi Frank,
Search for anchors in this forum, a google search will likely turn up some stuff too.

Relish
05-31-2009, 07:57 PM
Give an element the ID "top".



<a href="#top">Top<a/>


When that link is clicked, the page will jump to where the element with the ID "top" is located.

Alternatively you could use Javascript:



<script type="text/javascript">
function toTop() {
self.scrollTo(0, 0)
}
</script>

<a href="javascript: toTop();">Top</a>

_Aerospace_Eng_
05-31-2009, 08:41 PM
Give an element the ID "top".



<a href="#top">Top<a/>


When that link is clicked, the page will jump to where the element with the ID "top" is located.

Alternatively you could use Javascript:



<script type="text/javascript">
function toTop() {
self.scrollTo(0, 0)
}
</script>

<a href="javascript: toTop();">Top</a>

No need for javascript. You were on the right track but not entirely.

@Frank I assume you are talking about your sources page. Add this link to the bottom of your page.

<a href="#container">Top</a>
There problem solved. Clicking the link will go back to the beginning of your #container element.

Relish
05-31-2009, 10:33 PM
Not trying to be impolite, just wondering how I was off track..

And Happy Birthday Aerospace :)

jlhaslip
06-01-2009, 12:27 AM
Not trying to be impolite, just wondering how I was off track..

And Happy Birthday Aerospace :)

Javascript mayy not be available if the Client turns it off, and the CSS / HTML reply will do the same thing without the need for javascript.

abduraooft
06-01-2009, 09:29 AM
The first method shown at http://www.dynamicdrive.com/dynamicindex5/bookmarkscroll.htm is a good one, which uses a progressive enhancement (http://en.wikipedia.org/wiki/Progressive_enhancement) approach.

effpeetee
06-01-2009, 10:22 AM
Thanks Aero. Works fine.

It's here. (http://exitfegs.co.uk/Sources.html)

Frank

abduraooft
06-01-2009, 10:27 AM
Works fine. No, at least in FF. It's case sensitive, so use it like

<a href="#Container">Top</a> to match with your containers id attribute (or just do the reverse).

effpeetee
06-01-2009, 10:40 AM
No, at least in FF. It's case sensitive, so use it like

<a href="#Container">Top</a> to match with your containers id attribute (or just do the reverse).
Thank you abduraooft. It there anything that I can do to equalise the text size between the browsers? I like the size that IE8 gives.

Frank

_Aerospace_Eng_
06-02-2009, 05:34 AM
You need to set a default font-size on the body. Setting a font size in px will probably get you similar sizes on different browsers however IE users, not sure about IE8 will not be able to change their font size. I think IE7 has this issue as well. I know IE6 does.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum