https://github.com/jakobbossek/jquery.footnote

Plugin for the jQuery framework. Allows to place footnotes in articles similar to LaTeX footnotes. Dynamically extracts the footnotes and appends them in a handy ordered list.
https://github.com/jakobbossek/jquery.footnote

Last synced: 3 days ago
JSON representation

Plugin for the jQuery framework. Allows to place footnotes in articles similar to LaTeX footnotes. Dynamically extracts the footnotes and appends them in a handy ordered list.

• Host: GitHub
• URL: https://github.com/jakobbossek/jquery.footnote
• Owner: jakobbossek
• Created: 2014-03-19T13:42:58.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2014-03-29T11:38:09.000Z (over 10 years ago)
• Last Synced: 2024-10-11T18:33:07.503Z (27 days ago)
• Language: JavaScript
• Size: 172 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
jquery.footnote

===============

Recently I had the idea to place footnotes in blog articles as it is done in LaTeX. There you simply place a \footnote{My footnote text} directive in the floating text and TeX handles the construction of the footnotes list at the bottom of the corresponding page. The footnote plugin for jQuery offers a similar functionality. 

## Usage

In the following we take a glance at a simple example. Here we define an article containging some text and inside this text there is a nested footnote, marked up with the footnote class.

```HTML

  
Examplary article

  
Lorem ipsum Duis esse laborum id voluptate consectetur in veniam aute laboris 

  Amet eiusmod dolor consequat proident in voluptate 

  consectetur eu eiusmod officia veniam fugiat elit culpa in dolore elit.


```

In the header of out HTML document we simply load the current jQuery framework version and the footnote plugin. Finally we apply the footnote plugin to all ariticles if the DOM-tree is loaded entirely.

```HTML

  ...

  

  

  

    jQuery(document).ready(function($) {

      $("article").footnote();

    });

  

  ...

```

This call results in a LaTeX-like transformation of the embeded footnotes. Each one is replaced by a incrementing number and placed at the bottom of the article. Moreover it it clickable. A click smoothly scrolls down the article to the corresponing footnote list item.

## Parameters

The plugin offers some means of customizability. Beside declaring the class attribute of the footnote list one can set the time in milliseconds for the smooth scroll animation and an optional callback handler. For details take a glance at the implementation.