Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript
|
Javascript General Javascript discussions.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old March 22nd, 2010, 07:29 AM
Registered User
 
Join Date: Mar 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Default Javascript Page Scrolling

Hi,

I am new to javascript, in fact this is the first time I have used it,however I am adding this function to my website:

<a href="JavaScript:pageScroll()">Back to Top</a>

function pageScroll() {
window.scrollBy(0,-150); // horizontal and vertical scroll increments
scrolldelay = setTimeout('pageScroll()',100); // scrolls every 100 milliseconds
}


although evertime this function is clicked on it scrolls back to the top, however the action is still active everytime you try to scoll down it automatically goes back to the top. How do I stop the function from working once it has scrolled back to the top?? Any help would be much appreciated.

Thanks...
 
Old March 22nd, 2010, 09:36 AM
Friend of Wrox
 
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default

It scrolls on its own because the timer is still on. Instead of using scrollBy, use scrollTo:
Code:
<script type="text/javascript">
	function pageScroll() {
		window.scrollTo(0,0); 
	}
</script>
 
Old March 22nd, 2010, 10:15 AM
Registered User
 
Join Date: Mar 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Hi, thanks for that although the action it makes when you click the link,you can see it scroll up at a set speed rather than jumping to the to.

It is this self scrolling action that I want to impliment throughout my website, however I am not sure how to make it stop the scrolling action once it has reached its final point (the top of the page)

If you can help me with this I would be very grateful.

My code again :

Code:
<script language="JavaScript">
function pageScroll() {
    	window.scrollBy(0,-50); // horizontal and vertical scroll increments
    	scrolldelay = setTimeout('pageScroll()',5); }
Thanks
 
Old March 22nd, 2010, 10:21 AM
Friend of Wrox
 
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default

This should do it:
Code:
<script type="text/javascript">
function pageScroll() {
    	window.scrollBy(0,-50); // horizontal and vertical scroll increments
    	if (window.pageYOffset) {
		scrolldelay = setTimeout('pageScroll()',5); 
	}
}
</script>
 
Old March 22nd, 2010, 11:12 AM
Registered User
 
Join Date: Mar 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Thanks for that, your an absolute star, it works perfect.

I was also just wondering, is it possible to give this function an id that relates to the link on the page as I was going to have one that would scroll down the page aswell and maybe one that only scrolls small sections of the page...

althought how do I relate each different function with each link?

Thanks again...





Similar Threads
Thread Thread Starter Forum Replies Last Post
Quick IE Fix for Javascript: Horizontal Scrolling semiotically Javascript 2 January 26th, 2010 03:46 PM
scrolling a div tag in aspx page ankitd25 ASP.NET 2.0 Basics 2 March 17th, 2009 09:33 AM
Scrolling a page Perkele Dreamweaver (all versions) 0 February 19th, 2007 08:27 AM
horizontal scrolling javascript Adam H-W Javascript 4 December 5th, 2005 07:14 AM
Animated scrolling page title joshil Flash (all versions) 1 May 14th, 2004 03:45 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.