im trying to use a smooth scroll for my href elements. The only problem is that i can only get it to do it upwards.
The live site is here
If you click on the box "Webdesign" it should do a smooth scrool down to the .content. The same thing if you hit the button of the bottom of that content it should scroll up to the top again smoooth(That works fine) - Its downwards to the start of the "webdesign" content it doesnt work.
script used in the bottom of the site:
<script type="text/javascript">
$("a[href^='#']").click(function(){
var contentPosTop = $('.content').position().top;
$('html, body').stop().animate({
scrollTop: contentPosTop
}, 1500);
});
</script>
Any ideas?
In Firebug it says that contentPosTop is 0. I don't know why, but I didn't look into it because I don't think you need to calculate that value. You will scroll down the same distance in any option (the logo + the menu height ). Try something like 660 and see if it works. At least in my test it did.
$("a[href^='#']").click(function(){
$('html, body').stop().animate({ scrollTop: 660 }, 1500);
});
EDIT: To go back to the top
$('#starter-template').click(function() {
$('html, body').stop().animate({ scrollTop: 0}, 1500);
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments