1.0.1 • Published 6 years ago

@markhowellsmead/js-smoothhashscroll v1.0.1

Weekly downloads
1
License
ISC
Repository
-
Last release
6 years ago

Smooth anchor scrolling

jQuery script which checks the page URI for an anchor and scrolls to the target element smoothly.

Usage

  • Add an id= attribute to the element to which you want to scroll, which must match the location hash in the browser. e.g. id="comments".
  • Link to this element as usual: e.g. <a href="#comments">Scroll to comments</a>.
  • Initialize the JavaScript.

Initialize the JavaScript

$('a[href*="#"]').anchorAnimate();

Adding an offset

e.g. if you have a fixed toolbar. Update the value of the JavaScript variable anchorAnimateOffset.

// General offset
var anchorAnimateOffset = 16;

// Extend anchorAnimateOffset variable with your fixed elements
var setAnchorOffset = function(){
	$('.nav.toolbar').each(function(){
		if ( $(this).outerHeight() && $(this).css("position") === "fixed"){
			anchorAnimateOffset += $(this).outerHeight();
		}
	});
	anchorAnimateOffset = Math.floor(anchorAnimateOffset) - 1;
};

// Initialize the functionality
$(document).on('ready.anchoranimate', function(){
	$('a[href*="#"]').anchorAnimate();
});

// Update anchorAnimateOffset value
$(window).on('load.anchoranimate resize.anchoranimate', setAnchorOffset);

Changelog

1.0.1 2018-11-09

  • Change package scope
  • Fix README dates

1.0.0 2018-11-09

  • Initial version