Select from two different effects (simple or cube)
Select from different animation (transition) speed (simple effect)
Use font icon or image icon for front panel
Add link button to back panel
Trigger transition either by hover or click event
Use Google font for contents
Customize font and background colors
Apply custom borders to front and back panel
Add viewport animation to element
[/TS_VCSC_Fancy_List][TS-VCSC-Spacer height=”20″]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”20″]
SIMPLE LAYOUT
SHOW A CONTENT BOX WITH TWO SIDES
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]
Horizontal Flip
[TS-VCSC-Content-Flip flip_effect_style1=”vertical” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21941″ flip_border_type=”solid” front_background=”#f4ebde” animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_effect_style1=”vertical” flip_effect_speed=”veryslow” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21942″ flip_border_type=”solid” front_background=”#d5efc6″ animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_effect_style1=”vertical” flip_effect_speed=”veryfast” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21940″ flip_border_type=”solid” front_background=”#f7f7f7″ animations=”true” animation_view=”appear”]
[TS-VCSC-Spacer height=”40″]
Vertical Flip
[TS-VCSC-Content-Flip flip_effect_speed=”veryslow” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21929″ flip_border_type=”solid” front_background=”#f4ebde” animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21927″ flip_border_type=”solid” front_background=”#d5efc6″ animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_effect_speed=”veryfast” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21925″ flip_border_type=”solid” front_background=”#f7f7f7″ animations=”true” animation_view=”appear”]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”20″]
CUBE LAYOUT
SHOW A CONTENT BOX WITH TWO SIDES
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]
Right Flip
[TS-VCSC-Content-Flip flip_style=”style2″ front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21941″ flip_border_type=”solid” front_background=”#f4ebde” animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_style=”style2″ front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21942″ flip_border_type=”solid” front_background=”#d5efc6″ animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_style=”style2″ front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21940″ flip_border_type=”solid” front_background=”#f7f7f7″ animations=”true” animation_view=”appear”]
[TS-VCSC-Spacer height=”40″]
Upwards Flip
[TS-VCSC-Content-Flip flip_style=”style2″ flip_effect_style2=”ts-flip-up” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21929″ flip_border_type=”solid” front_background=”#f4ebde” animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_style=”style2″ flip_effect_style2=”ts-flip-up” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21927″ flip_border_type=”solid” front_background=”#d5efc6″ animations=”true” animation_view=”appear”]
[TS-VCSC-Content-Flip flip_style=”style2″ flip_effect_style2=”ts-flip-up” front_title=”Content Flip Box” font_fronttitle_family=”Default:regular” front_content=”This is the message for the front panel of this flip box.” font_frontcontent_family=”Default:regular” back_title=”Back Title” font_backtitle_family=”Default:regular” back_content=”This is the back message.” font_backcontent_family=”Default:regular” read_more_link=”true” font_button_family=”Default:regular” read_more_url=”#” front_icon_replace=”true” front_image=”21925″ flip_border_type=”solid” front_background=”#f7f7f7″ animations=”true” animation_view=”appear”]
