Year: 2013
October 2013
December 2013

Posted on

Print-O-Matic Exclude Test

This is some text that should be printed because it is in a div that has been assigned the *print* class.

This is some dirty text that should not be printed because it is in a div with the naughty *noprint* class

back to the print class, time to close things up.

Now for the shortcode:
[print-me target=".print" exclude=".noprint"]

Posted on

Strange hasClass Issue

Trigger Text
Target Content
Trigger Text
Target Content
Trigger Text
Target Content
Trigger Text
Target Content
Trigger Text
Target Content
Trigger Text
Target Content
On
Open
Target Content
Posted on

Collapse-O-Matic Multi Triggers & Targets

Multiple Triggers

Add the format extra[n]-id to add extra external triggers for a single target:
<div id="test" class="collapseomatic">Trigger 1</div>
<div id="target-test" class="collapseomatic_content">You might think you can catch a monkey, but you can't. Monkeys are FAST!</div>
<div id="extra1-test" class="collapseomatic">Trigger 2</div>
<div id="extra2-test" class="collapseomatic">Trigger 3</div>

which should produce a little something like:

Trigger 1
You might think you can catch a monkey, but you can’t. Monkeys are FAST!
Trigger 2
Trigger 3

Multiple Targets

Multiple targets are available only in the Collapse-Pro-Matic plugin. To add extra targets, assign the ID in the format of target[n]-id as follows:
<div id="target1-monkey" class="collapseomatic_content">content</div>
<div id="monkey" class="collapseomatic">Trigger</div>
<div id="target2-monkey" class="collapseomatic_content">content</div>

which should produce a little something like:

You might think you can catch a monkey, but you can’t. Monkeys are FAST!
Trigger
You might still think you can catch a monkey, but you really can’t. Monkeys are still FAST!
Posted on

Column-Matic Responsive Test

Column-Matic Shortcode

[[column class="column_left" float=""]Yada yada, spiffy logo image with a funky monkey and a wiffle-ball bat.[/column]]
[[column class="column_right" float=""]Yippy Skippy another logo image with a ding-ding-dong touching tra-la-la.[/column]]
[[end_columns]]

CSS

For normal screens:

.column_left {
    margin-left:0;
    float:left;
    width: 40%;
}
.column_right {
    float: left;
    margin-left: 10px;
    border-left: 1px dotted red;
    padding-left: 10px;
    width: 40%; 
}

For Screens smaller than 450px wide:

@media (max-width: 450px) {
    .column_left, .column_right{
        width: 95%;
        margin: 0 auto;
                padding: 3px;
        clear: both;
        border: none;
    }
}
[column class=”column_left” float=””]Yada yada, spiffy logo image with a funky monkey and a wiffle-ball bat.[/column] [column class=”column_right” float=””]Yippy Skippy another logo image with a ding-ding-dong touching tra-la-la.[/column] [end_columns]