I am working on a new page for our site and I have run into a small issue that I cannot figure out the solution to. We have a link in the top section of our site that we would like to, on click, have the page scroll down to the bottom of the page to the links to get started. The issue is that when clicked the page just jumps straight down with no animation. I found the code here http://jsfiddle.net/YtJcL/ and it works perfectly on the fiddle. Below is the code from my site. Any and all help is appreciated! Here is the actual page link: http://www.scrubsandbeyond.com/koibysanita.aspx
HEAD:
<script type="text/javascript" src="/scripts/jquery-1.9.1.min.js"></script>
HTML:
<a class="scroll" href="#destination1">apply now</a>
<section id="destination1">Let's get started!</section>
jQuery:
$(".scroll").click(function(event){
event.preventDefault();
//calculate destination place
var dest=0;
if($(this.hash).offset().top > $(document).height()-$(window).height()){
dest=$(document).height()-$(window).height();
}else{
dest=$(this.hash).offset().top;
}
//go to destination
$('html,body').animate({scrollTop:dest}, 1000,'swing');
});
EDIT: added page link
Here is updated code from you site. Try this-