Home Blog Programming Smooth Scrolling To Internal Links With Jquery

Smooth Scrolling To Internal Links With Jquery

Posted on January 4, 2014 by Edit

JQuery allows smooth scrolling to hashtag

Code

var $root = $('html, body');

$('a').click(function() {
  var href = $.attr(this, 'href');
  var hash;

  if(href == '#'){
	hash = $('body');
  }else if(href.match(/^#[a-zA-Z0-9]+$/g)){
	hash = $('[name='+href.substring(1)+']');
  }else
	return true;

  $root.animate({
	  scrollTop: $(hash).offset().top
	}, 500, function () {
	  window.location.hash = href;
  });

  return false;
});

Raw Code

Example

Paragraph 1. Go to pragraph 10

Paragraph 2

Paragraph 3. Go to pragraph 8

Paragraph 4

Paragraph 5

Paragraph 6

Paragraph 7

Paragraph 8

Paragraph 9

Paragraph 10

Paragraph 11

Paragraph 12. Go to pragraph 19

Paragraph 13

Paragraph 14

Paragraph 15

Paragraph 16

Paragraph 17

Paragraph 18

Paragraph 19

Paragraph 20. Go to pragraph 1

Tags : jquery
This website is made possible by displaying online advertisements to our visitors.
Please consider supporting by disabling your ad blocker.

Get new posts by email:
loading comments...
© 2023 Shivaji Varma. Made in India.