I am creating a Landing page website. Nav link is working when click on it it's goes to bottom and then bottom to top. But i want to make it slow with jQuery Animation. Please check my code and tell me where i am wrong. Thank you.
// Smooth Scrolling nav links
$('a[href^="#"]').on('click', function(event) {
var target = $( $(this).attr('href') );
if( target.length ) {
event.preventDefault();
$('html, body').animate({
scrollTop: target.offset().top,
scrollBottom: target.offset().bottom
}, 1000);
} });
The code is fine and works, you simply forgot to put a comma after target.offset().top
Have a look here for a demo: https://jsfiddle.net/L02tck8x/
You can also try like below
HTML:
Link: <a href="#toBottom" class="toBottom">Scroll to Bottom ↓</a>
Target: <a name="toBottom"></a>
Link: <a href="#toTop" class="toTop">Scroll to TOP ↑</a>
Target: <a name="toTop"></a>
JS
$('.toTop ').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
$('.toBottom').click(function(){
$('html,body').animate({scrollTop: $(document).height()}, 600);
return false;
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.