A Pluginoven Test Site
Scroll to here on close The above will be used as our ‘scroll target’ and was created using the following: <h2 id=”scroll2me”>Scroll to here on close</h2> The scrolltarget attribute allows any external element to be used as the location to scroll to for scroll-on-close triggers. The scrolltarget attribute accepts any jQuery selector by ID (#id_name), …
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… …
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”
Roll-Your-Own Method We have already demonstrated how the new animation_effect and duration attributes work with a shortcode. Now we will show the same example but using the roll-your-own method. As always, the default effect is slideFade and duration is fast, but these can be overwritten globally in the plugin settings. As of version 1.7.3 these …
Continue reading “Collapse-O/Pro-Matic Roll-Your-Own Method Slider Effect and Duration”
Currently the slide effect and duration can be set globally under the plugin settings, but what if we want to set it individually per collapse element? We need the ability to add this via a shortcode attribute and as a data attribute for the roll-your-own method. Shortcode Attributes Default animation_effect is slideFade and duration is …
Continue reading “Collapse-O/Pro-Matic Slider Effect and Duration Attributes”
As of Collapse-O-Matic version 1.7.2 and Collapse-Pro-Matic version 1.3.2 we have added the ability to force one element to stay open in a highlander grouping. Simply add the class must-be-one to all the triggers in a highlander group using the trigclass attribute like so: Shortcode Monkeys… Donkeys… Ninjas… Example
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”