Toggle-O-Matic Display

How It Works...

Any ID'd element can have its display property toggled with Toggle-O-Matic Display. Simply assign an ID to an element, and use this extension to toggle back and forth between the original display state and block or none. For example, you could have:

<p id="myParagraphID">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin risus diam, bibendum eu, semper sed, lacinia sit amet, tortor. Maecenas viverra enim.</p>

When you apply the extension to change that paragraph's display property, essentially the browser treats it like this:

<p id="myParagraphID" style="display: none;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin risus diam, bibendum eu, semper sed, lacinia sit amet, tortor. Maecenas viverra enim.</p>

Example: Toggle It!

If you applied Toggle-O-Matic Display to a hyperlink, as described in the code examples above it would look like this:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin risus diam, bibendum eu, semper sed, lacinia sit amet, tortor. Maecenas viverra enim.

Now every time you click the Toggle It! link, you'll see the paragraph toggle back and forth between its original state (display: block) and it's opposite (display: none).