A quick question about a little jquery script

bamme

Senior Member
Hi everyone

As some of you know im rubbish at javascript :)

I hardly understand it, so I resort to premade library plugins and effects while I learn about it. I'm currently using this one: http://djpate.com/portfolio/scrollTop/

(Code here:)

Code:
   <script>        function goToByScroll(id){                 $('html,body').animate({scrollTop: $("#"+id).offset(-620).top},'slow');        }        </script>

(HTML snippet here:)

HTML:
<ul>
      <li><a href="javascript:void(0)" onClick="goToByScroll('1')">Soups</a></li>
...
...
...

<p class="section" id="1">SOUPS</p>

What id like to do is modify the little script so that it will scroll to the anchor, minus or plus X amount of pixels. My header is fixed position at the top of the screen, it's height is 220px. The content area currently scrolls underneath the header, missing out 220px worth of content, as the id is right at the top.

Heres an example to show you what i mean (this isnt a finished project, sorry about messy areas..)

Untitled Document
 
Now I'm not a javascript guru and I had to check it first but it looks like 'offset' is the thing that needs changing :)

Assuming that is the bit - in your code you've got the (-620) just play around with that till you're happy with it.
 
Thanks Levi, The reason a number is in there is because thats what I tried - unfortunately it doesn't seem to make any difference :L
 
Thanks ralph but the little number within the brackets next to offset doesnt seem to do anything at all, regardless of what's in it
 
It only takes tht javascript snippet I posted glen, and jquery.js. I've posted a link to the actual plugin demo page above in my first post
 
Solved it - for reference:
... $('html,body').animate({scrollTop: $("#"+id).offset().top - 280},'slow'); ...
 
Back
Top