Reputation: 6081
I have a floating navigation bar on the top of the page so when I click of #ID links it hides the object I want to scroll to behind it.
I am using jquery for scrolling with this code:
<script>
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
</script>
Is there a way I can scroll to slightly lower or higher than the location of the tag by a set amount of pixels?
Note: Make sure to allow "unsafe content" in chrome since some of the jquery wont work otherwise.
Upvotes: 0
Views: 213
Reputation: 1741
Change scrollTop: target.offset().top
to scrollTop: target.offset().top + x
where x is the number you would like to add or subtract
Upvotes: 1