Beautify Boring Footnotes with jQuery Bigfoot

Beautify Boring Footnotes with jQuery Bigfoot

Beautify Boring Footnotes with jQuery Bigfoot

The way we handle footnotes on a webpage is rather standard. We superscript a number and put it at the end of the corresponding paragraph. Whenever user clicked on it, it will bring them to the footnote section (Usually bottom of the page). Creating footnote is actually a quite tedious routine and they usually look unattractive. This time, we have a found really good solution - Bigfoot jQuery plugin. It's created for empowering footnotes.

Bigfoot jQuery plugin has a pretty attractive website, I'd say really well-designed! Bigfoot is designed to solve footnote issue, it makes it easy to make footnote and display it beautifully.

This script looks to make that whole process painless. It automatically detects the footnote link and content, turns the link into an easy-to-click button, and puts up a popover when the reader clicks on the footnote button.

The script and default styles are built to work great on any size viewport; the popover will be positioned on the top/ bottom automatically (based on the relative amount of space), will update its location as the viewport changes size, and will ensure that the popover never scrolls offscreen. All of that adds up to a much-improved user experience.

More Details

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!