having some trouble understanding this simple jquery script

it's a cool scroll script that scrolls down the page to your content

here is where i got it from: http://github.com/kswedberg/jquery-smooth-scroll

the readme says:

So how would first all the jquery file, like this (in the header):

<script type="text/javascript" src="http://mysite.com/js/jquery-1.3.1.min.js"></script> 
<script type="text/javascript" src="http://mysite.com/js/jquery.smooth-scroll.js"></script> 

Code (markup):

Then how would I add the script to a link?

<a href="$('#container a').smoothScroll();">link</a>

??


The div it would be calling would be somewhere down the page, called
#container, right?

thanks!

 

If you want to apply this to an 'a' element within #container div then you would add the following code in head section of page after the plugin link.

$(function(){

$('#container a').smoothScroll();

});

Code (markup):

 

parent id container and all anchor children

 

You don't even need to use a container id. You can just use $('a') in the same fashion posted above

 

thats not a good idea, by giving it a parent node #container it saves it from trversing the whole DOM - it will only look at child nodes that match tag a, which is a javascript native (and the fastest) selector (element.getElementsByTagName("a")[0]);

always try to help your selectors if you can by pushing them up the dom tree. same for css, if you make a class .title which is only applicable to div that are children of #maincontent then do the css class as #maincontent div.title { }