PDA

View Full Version : help.. skrollTo.. (?)



ijis
05-07-2008, 03:18 PM
i found this part of code:
<a href="#challenge" onclick="return skrollTo('challenge');">

from: http://unite.blogcatalog.com/

apparently it's a part of code to automatically scroll to particular part of the site when clicked..

i tried to find tutorials for this kind of action but haven't got any luck..

can u guys help? :)

TimFA
05-07-2008, 09:20 PM
Couldn't you just use HTML anchors??

Heres scroll spot:


....
<a name="something">spot to scroll to</a>
....


Way to scroll:


....
<a href="#something">scroll to a spot</a>
....


Or are you looking for JavaScript:



....
<a href="#" onClick="scrollTo(100,0);">scroll to a spot</a>
....


Red objects need to be changed to correspond with eachother in the first example, and in num.2 you need to change them to x-postion and y-position to scroll to, for more info check here:
http://www.w3schools.com/HTMLDOM/met_win_scrollto.asp. (http://www.w3schools.com/HTMLDOM/met_win_scrollto.asp)

Tim

Medyman
05-07-2008, 10:54 PM
That site uses mootools to achieve that effect, I think. I prefer jQuery. The plugin I use most often for these kinds of effects is jQuery.ScrollTo by Ariel Flesler (http://www.freewebs.com/flesler/jQuery.ScrollTo/)

TimFA
05-08-2008, 03:11 AM
Ahh. Scratch my last post, sorry misread and looked at site wrong. I thought he was referring to the scrolling itself. Sorry.

ijis
05-20-2008, 03:17 PM
Thank you TimFA, actually I WAS looking for that simple code.. but then I got tempted by the effect that Medyman suggested.

Btw i'm a she not a he :)

ijis
05-20-2008, 03:23 PM
That site uses mootools to achieve that effect, I think. I prefer jQuery. The plugin I use most often for these kinds of effects is jQuery.ScrollTo by Ariel Flesler (http://www.freewebs.com/flesler/jQuery.ScrollTo/)

OMG! I so want that effect! especially the easing:'elasout'. It's so cool.
But it doesn't have a step by step tutorial.

Where should i put what on my site's codes?

Still need help here.

Medyman
05-20-2008, 03:49 PM
Well, no it doesn't have step-by-step tutorials.

But there is fairly good documentation here (http://flesler.blogspot.com/2007/10/jqueryscrollto.html). And also linked on that page are some demos (from which you can glean specific usage).

A little easier to work with for you might be serialScroll (http://flesler.webs.com/jQuery.SerialScroll/), which is a little easier to implement.

You'll have to download the jQuery javascript library (http://jquery.com/) as well as the Ariel's plugins. Include them in your <head> section just like regular links to external javascript (http://www.webreference.com/programming/javascript/external/).

ijis
05-21-2008, 10:43 AM
Download jQuery

Download jQuery 1.2.5 (16kb, Minified and Gzipped) Great for production use.

Download jQuery 1.2.5 (97kb, Uncompressed) Great for testing, learning and development.

Download jQuery 1.2.5 (30kb, Packed) For those that can't Gzip their JavaScript.

jQuery 1.2.4 Release Notes What was changed in the release.

Which to download?

Medyman
05-21-2008, 12:04 PM
It doesn't matter. I doubt you'll be going into the code and tinkering, so the minified and gzipped would be fine.

If you do plan to view the source for whatever reason, go with the uncompressed.

TimFA
05-22-2008, 05:24 PM
Sorry for the he & she mistake ...