Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

jQuery Anchorify Built with Grunt

jQuery Anchorify is a plugin that creates anchors for headings in your website.

Usage

Include jQuery and the file anchorify.min.js in your website:

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="./anchorify.min.js"></script>

Then run jQuery Anchorify with:

jQuery(window).load(function () {
    jQuery('body').anchorify();
});

It will scan the element <body> for headings and will create anchors based on the text of the heading.

Styling

You may have noticed that a S/CSS file is not included in this plugin. That's because there's not much to style. If you're looking to get started check out these rules from the example.html file.

.header-link {
  display: inline-block;
  margin-left: -20px;
  padding-right: 8px;
  }

.header-link svg {
  visibility: hidden;
  }

h1:hover .header-link svg,
h2:hover .header-link svg,
h3:hover .header-link svg,
h4:hover .header-link svg,
h5:hover .header-link svg,
h6:hover .header-link svg {
  visibility: visible;
} 

Examples

About

jQuery Anchorify is a plugin that creates anchors for headings in your website.

Resources

License

Releases

No releases published

Packages

No packages published