Menu
Morning Guys,
Ok so I am using Bootstrap 3 to build my website - wanting to polish it off using the scrollTop smooth scroll on anchored tags. Cannot get it to work for the life of me.
So here is my code:
<script type="text/javascript" src="js/animate.js"></script>
<body>
<div id='imgDiv'>
<div class="container">
<center>
<a href="#imgDiv2"><h2>my link</h2></a>
</center>
</div>
</div>
<a href="">
<div id='imgDiv2'></div>
some content here
</div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
This is the script inside animate.js
// JavaScript Document
$(document).ready(function() {
$('a[href^="#"]').click(function() {
var target = $(this.hash);
if (target.length == 0) target = $('a[name="' + this.hash.substr(1) + '"]');
if (target.length == 0) target = $('html');
$('html, body').animate({ scrollTop: target.offset().top }, 500);
return false;
});
});
So it does anchor to the div id named imgDiv2 but not using the smooth scrolling animation, any thoughts?
216
You need to include animate.js after jQuery since your jQuery code inside animate.js require jQuery core library to work:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/animate.js"></script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
