Skip to content

reduxdj/jquery-smooth-scroll

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Smooth Scroll Plugin

Features

$.fn.smoothScroll

  • Allows for easy implementation of smooth scrolling for same-page links.
  • Works like this: $('a').smoothScroll();
  • Specify a containing element if you want: $('#container a').smoothScroll();
  • Exclude links if they are within a containing element: $('#container a').smoothScroll({excludeWithin: ['.container2']});
  • Exclude links if they match certain conditions: $('a').smoothScroll({exclude: ['.rough','#chunky']});
  • Adjust where the scrolling stops: $('.backtotop').smoothScroll({offset: -100});
  • Add a callback function that is triggered after the scroll is complete: $('a').smoothScroll({afterScroll: function() { alert('we made it!'); }});
  • Add back button support by including a history management plugin such as Ben Alman’s BBQ. See demo/bbq.html for an example of how to implement this.

$.smoothScroll

  • Utility method works without a selector: $.smoothScroll()
  • Can be used to scroll any element (not just document.documentElement / document.body)
  • Doesn’t automatically fire, so you need to bind it to some other user interaction. For example:

$(‘button.scrollsomething’).click(function() {
$.smoothScroll({
scrollElement: $(‘div.scrollme’),
scrollTarget: ‘#findme’
});
return false;
});

$.fn.scrollable

  • Selects the first matched element that is scrollable. Acts just like a DOM traversal method such as .find() or .next().
  • This method is used internally by the plugin to determine which element to use for “document” scrolling: $('html, body').scrollable().animate({scrollTop: someNumber}, someSpeed)

About

Automatically make same-page links scroll smoothly

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published