<a class="jumper" href="#whatever" data-soffset="0">Whatever</a>
<section id="whatever">blah blah blah</section>
$(document).ready(function() {
$(".jumper").click(function() {
var ScrollOffset = $(this).attr('data-soffset');
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top-ScrollOffset + "px"
}, {
duration: 1500,
easing: "swing"
});
return false;
});
});
Thanks for your time Teso. It worked.It doesn't change pages, it scrolls down to the div
The nav:
HTML:<a class="jumper" href="#whatever" data-soffset="0">Whatever</a>
The content:
HTML:<section id="whatever">blah blah blah</section>
The JavaScript:
HTML:$(document).ready(function() { $(".jumper").click(function() { var ScrollOffset = $(this).attr('data-soffset'); $("html, body").animate({ scrollTop: $($(this).attr("href")).offset().top-ScrollOffset + "px" }, { duration: 1500, easing: "swing" }); return false; }); });