Advanced Search

Return to Snippet

Revision: 5643
at March 21, 2008 19:11 by TALlama
Initial Code 
var Footnote = Class.create({
	initialize: function(element) {
		var notes = this.findNotes();
		var number = notes.select('li').length + 1;
	
		var ref = document.createElement('a');
		ref.className = 'footnote-reference';
		ref.href = '#footnote-' + number;
		ref.id = 'reference-' + number;
		ref.appendChild(document.createTextNode(number));
		element.parentNode.insertBefore(ref, element);
		
		$(element).removeClassName('footnote')
		
		var li = document.createElement('li');
		li.className = 'footnote';
		li.id = 'footnote-' + number;
		li.appendChild(element);
		
		var backref = document.createElement('a');
		backref.className = 'footnote-backreference';
		backref.href = '#reference-' + number;
		backref.appendChild(document.createTextNode("\u21A9"));
		li.appendChild(document.createTextNode(" "));
		li.appendChild(backref)
		
		notes.appendChild(li);
	},
	findNotes: function() {
		return $('notes');
	}
});
		
Event.observe(window, 'load', function() {
	$$('.footnote').each(function(e) {new Footnote(e)});
})
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
Finds footnotes and adds them to a list. Just put "footnote" into the class of an element, and it'll automatically pull it out of context, replace it with a reference link, put the footnote into the list with id 'notes', and include a backreference so that your readers don't get lost. Embedded markup and nested footnotes work fine. Everything has CSS classes, so you can style it to your heart's content. Requires Prototype.

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Javascript Footnote Creator

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
JavaScript