Search Results for: collapse-o-matic

FictionIs like non-non-fiction Star WarsHyperspeedTarget Content Star TrekWarpspeedTarget Content

Here is an example of how to pimp the collapse-o-matic expand to use a grey bar style using CSS. Be sure you are using the div ad your default tag in the plugin settings. The CSS: .greybar { border: 1px dotted #aaaaaa; padding: 7px; background-position: 98% center; background-color: #cccccc; } The Code: Monkeys Are Fast… …

Continue reading “Collapse-O-Matic Grey Bar Style”

Shortcode This is an example of some text that has a trigger placed inline, meaning that the trigger does not break the flow of the text. However, when is clicked and the target is expanded, the target would break the paragraph as a display: block element. Naturally, when the element is collapsed, the inline flow …

Continue reading “Collapse-O-Matic Inline Trigger with Block Target”

Here is a nested expand to test this issue. Level 1 Nested Level a1answer a1 Nested Level a2answer a2 Level 2 Nested Level b1answer b1 Nested Level b2answer b2 Here are some external triggers: <a class=”expandanchor” href=”#q1″>Level 1</a> <a class=”expandanchor” href=”#a1″>Level 1a</a> <a class=”expandanchor” href=”#a2″>Level 1b</a> <a class=”expandanchor” href=”#q2″>Level 2</a> <a class=”expandanchor” href=”#b1″>Level 2a</a> <a …

Continue reading “Collapse-O-Matic External Triggers for Nested Element”

First let’s test the mobile-only and mobile-exclude shortcodes to see if they are included with the plugin. No, they are not. Now we install the Graphene Theme and test… Oops, wrong Graphene Theme. It seems This Theme is all that is required for testing the shortcodes. Mobile Only [[mobile only]…[/mobile-only]] [mobile only] this is some …

Continue reading “Collapse-O-Matic, Graphene Theme & Any Mobile Switcher Test”

When an expand element is expanded it has the .colomat-close class assigned. This class is removed when the expand element is collapsed. So, if you want to adjust how an active/expanded trigger is displayed, simply define your custom css as follows: /*inactive/collapsed */ .collapseomatic { } /*active/expanded */ .collapseomatic.colomat-close { } Simple Demo Using the …

Continue reading “Collapse-O-Matic CSS Tricks .colomat-close”

If we set up two groups for the sole purpose of creating expand/collapse all triggers that will only expand/collapse the related group we currently have to create something like: Science Fiction: Star WarsAlliance to Restore the Republic vs. Galactic Empire <span class=”expandall” rel=”fiction”>Expand All Science Fiction</span> <span class=”collapseall” rel=”fiction”>Collapse All Science Fiction</span> Pure Science: Space …

Continue reading “Collapse-O-Matic Grouping and Expandall Issues”

Test 1 <h7>Test Header</h7> <strong>Strong Text</strong> This is a bit of text that goes on for awhile just to create the illusion that there is something important to say. After some time we might want to create a little teaser for this text that was hidden but now is not. Read moreRead Less Test Header …

Continue reading “Collapse-O-Matic Collapse-Pro-Matic Inline Test”

This is a follow-up post to Collapse-O-Matic > Line of Trigger Images. This time we want to have the triggers in-line but the content to be displayed below the trigger line. To do this we first must use the roll-your-own method. Triggers: Targets: The Results: Trigger One Trigger Two Trigger Three Target One Target Two …

Continue reading “Collapse-O-Matic – Inline Roll-Your-Own Triggers”