Press "Enter" to skip to content

Add Smooth Links and Scroll Buttons to Anchor Links | jQuery Anchor Scroll

jQuery Anchor Scroll, An alternative to CSS property that applies a smooth scrolling effect with configurable fast, loosening, and offset for anchor links within the document.

How to make use of it:

1. Insert the JavaScript jquery-anchorScroll.js after loading the most recent jQuery library.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/js/jquery-anchorScroll.js"></script>

2. Call the function on the target container during which you need to allow the graceful scroll impact and accomplished.

<nav class="nav">
      <a href="#section01">Top</a>
      <a href="#section02">How to use [Basic]</a>
      <a href="#section03">Settings for each section</a>
      <a href="#section04">Event</a>
var anchorScroll = $(document).AnchorScroll({
    // options here

3. Determine the anchor links that must be affected by the plugin. Defaults to all anchor links discovered throughout the doc.

var anchorScroll = $(document).AnchorScroll({
    target: 'a[href^="#"]'

4. Customize the animation speed.

var anchorScroll = $(document).AnchorScroll({
    speed: 1000

5. Specify the offset in px.

var anchorScroll = $(document).AnchorScroll({
    offset: 20

6. Apply an easing function to the graceful scroll impact. You would possibly want a third easing library for extra easing features.

var anchorScroll = $(document).AnchorScroll({
    easing: "linear"

7. Determine whether or not to heart the sectioned content after scrolled.

var anchorScroll = $(document).AnchorScroll({
    center: 1

8. You’re additionally allowed to go choices through data attributes as follows:

<section id="section03" 
         Section 3

9. Available events that can be fired earlier than or after scroll.

anchorScroll.on('scrollStart', function (event) {
  var target =,
  settings = event.settings;
  if( $(window).width() < 768 ) { = 0;

anchorScroll.on('scrollEnd', function (event) {
  var target =;

Custom Smooth Scroll For Anchor Links, jQuery Anchor Scroll Plugin/Github


See Demo And Download

Official Website(Vicugn4Pac0s): Click Here

This superior jQuery/javascript plugin is developed by Vicugn4Pac0s. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.