https://github.com/thinkphp/toc

TOC is a MooTools Plugin which turn a list of HTML headings into a Table of Content
https://github.com/thinkphp/toc

Last synced: 8 months ago
JSON representation

TOC is a MooTools Plugin which turn a list of HTML headings into a Table of Content

Host: GitHub
URL: https://github.com/thinkphp/toc
Owner: thinkphp
Created: 2010-07-03T07:53:58.000Z (over 15 years ago)
Default Branch: master
Last Pushed: 2010-07-03T11:29:42.000Z (over 15 years ago)
Last Synced: 2025-06-03T20:31:30.431Z (10 months ago)
Language: JavaScript
Homepage: http://thinkphp.ro/apps/js-hacks/toc/mootools/toc.html
Size: 156 KB
Stars: 1
Watchers: 2
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

          TOC

===

TOC is a MooTools Plugin which turn a list of HTML headings into a Table of Content.

![Screenshot](http://farm5.static.flickr.com/4117/4757170244_07f03e67e9_b.jpg)

 

How to Use

----------

TOC can be initialized an any time, but will most likely be initialized at DOMReady.

First you must to include the JS files in the head of your HTML document.

       

     #HTML

     

     

In your JavaScript code:

     #JS

     window.addEvent('domready',function(){

        var toc = new TOC('toc');

     }); 

In your HTML code:

     #HTML

     


     Unobtrusive JavaScript

     Operation Cleanout

     Never, under any circumstances add JavaScript directly to the document

     JavaScript is an enhancement, not a secure functionality

     Check the availability of the object before accessing it

     Create JavaScript, not browser specific dialects

     Don't hijack other script's variables

     Keep effects mouse independent

     Reach what you want to change

     Function to reach an element in the page

     Tool to navigate from a certain element

     Attributes and functions for elements

     Creating and destroying elements

     createElement(element)

     createTextNode(string)

     setAttribute(attribute,value)

     appendChild(child)

     cloneNode

     hasChildNodes()

     insertBefore(newChild,oldChild)

     removeChild(oldChild)

     replaceChild(newChild,oldChild)

     removeAttribute(attribute)

     Separated JS and CSS

     Our mistake

     Applying classes via JavaScript

     Multiple classes syntax

     Useful links

     http://www.w3.org/DOM

     Quirksmode.org

     The W3C DOM specification (http://www.w3.org/DOM/)

     http://www.scottandrew.com/weblog/jsjunk#events