Jump to content

[Solved] Animated scolling


damiancds
 Share

Recommended Posts

So I was perusing a site and noticed something that I wouldn't mind implementing on my site.Pretty much everywhere on my site, I've got top links (these are the tree links or name links) where "go back to the top" and when you click it you go back to topI've already got those in my site but what i want is when I clicked it in the other person's site, it animated as if i had used the scroll bar to go back upthe site is webdesignerheaven, so you can look to see what i mean (they're the little up arrows at the end of every title bar thingy like font, stock photography, and so on...I basically want that effect for my site, and I'm pretty sure it's java scriptin fact I went there and used web developer addon and disabled the javascript and they didn't workonly, i want mine to workso i'll have my regular tree anchors and just have the effect in javascript so without it they don't break completelyEDIT:I changed the topic title to reflect more accurately what I'm trying to accomplish

Edited by damiancds
Link to comment
Share on other sites

They are using either the scrollTo() method or they're using the scrollTop property. They use setTimeout or setInterval to make the page move a few pixels every set amount of time to give the impression that it's moving.

Link to comment
Share on other sites

  • 7 months later...

after forgetting about this for a little bit, i came upon some code that achieved this effect (although not as smoothly)

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

the only problem is that when it reaches the top, it doesn't stop scrolling up. I was hoping someone knew how to detect if the user was at the top of the screen therefore i could set a condition to stop it.EDIT:I recently found the innerWidth, innerHeight and the pageXOffset, pageYOffset properties which will help make it fancier. but the only problem i have is to determine when the user has reached the top. What would be really helpful is if there was a method/property like window.yPos() that returned the the current y position ( so i can test when user has reached the top of the content to cancel the scrolling.)

Edited by damiancds
Link to comment
Share on other sites

I recently found a great script on dynamic drive that did exactly what i wanted to, so that portion is solved. and i just have a link to the top in <noscript> tags for when the javscript is turned off.EDIT:script --> http://www.dynamicdrive.com/dynamicindex3/scrolltop.htm

Edited by damiancds
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...