Layout - Shortcodes: Flip Box
Saturday, January 31, 2015 10:12 PMShortcodes
[intense_flip_box]
[intense_flip_box_item]
Description
The Flip Box shortcode lets you add a box to the screen that will flip/cycle through the items within it. Choose from several different flip animations. Add two or more items with many different options for cycling through the items.
Attributes
intense_flip_box
| Attribute | Type | Dialog Title | Description | Default | Available Values |
|---|---|---|---|---|---|
| id | text | ID | must be unique for the post/page | ||
| direction | hidden | Direction | |||
| trigger | hidden | Switch Tab Trigger | |||
| animation | dropdown | Animation | solid-flip | none - None cycle-down - Cycle Down cycle-left - Cycle Left cycle-right - Cycle Right cycle-up - Cycle Up fade - Fade flip - Flip solid-flip - Solid Flip scale - Scale scale-up - Scale Up slide-down - Slide Down slide-left - Slide Left slide-right - Slide Right slide-up - Slide Up | |
| active_tab_background_color | hidden | Active Tab Background Color | |||
| active_tab_font_color | hidden | Active Tab Font Color | |||
| width | text | Width | leave blank for full width | ||
| class | text | CSS Class | |||
| rtl | hidden | right-to-left | |||
| delay | text | Delay | number of milliseconds to wait before switching from the first item | ||
| speed | text | Speed | number of milliseconds to wait before switching between items | ||
| reset | checkbox | Reset | reset when the focus is lost | 1 | 1 = true, 0 = false |
| loop | checkbox | Loop | loop through the items | 1 | 1 = true, 0 = false |
intense_flip_box_item
| Attribute | Type | Dialog Title | Description | Default | Available Values |
|---|---|---|---|---|---|
| content_background_color | color_advanced | Content Background Color | option colors - primary, error, info, inverse, muted, success, warning, link web color - hex, rgb, rgba, hsl, hsla, color name (see wikipedia web colors) | ||
| content_font_color | color_advanced | Content Font Color | option colors - primary, error, info, inverse, muted, success, warning, link web color - hex, rgb, rgba, hsl, hsla, color name (see wikipedia web colors) |
Examples
[intense_flip_box width="300"]
[intense_flip_box_item]
[intense_alert margin_bottom="0"]
I am an alert within a flip box
[intense_filler bytes="400"]
[/intense_alert]
[/intense_flip_box_item]
[intense_flip_box_item]
[intense_alert margin_bottom="0" color="error"]
I am another alert within a flip box
[intense_filler bytes="400"]
[/intense_alert]
[/intense_flip_box_item]
[/intense_flip_box]