{"id":11189,"date":"2013-11-06T21:36:20","date_gmt":"2013-11-06T21:36:20","guid":{"rendered":"http:\/\/dante.swiftideas.net\/?page_id=11189"},"modified":"2013-11-06T21:36:20","modified_gmt":"2013-11-06T21:36:20","slug":"animation-icon-boxes","status":"publish","type":"page","link":"https:\/\/joymarkfoundation.org\/index.php\/shortcodes\/animation-icon-boxes\/","title":{"rendered":"Animation: Icon Boxes"},"content":{"rendered":"[spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Animate your icon boxes in any of the 9 different ways (see examples below).
\nAnimation will only occur on appear and you can also set the animation delay to synchronise how your content appears.\u00a0<\/span><\/h3>\n
Please note: Animations are disabled on tablet &
\nmobile devices for a better experience.<\/span><\/h6>\n[\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\n
<\/i><\/div>

Fade from left - delay: 0<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″]\n
<\/i><\/div>

Fade In - delay: 400<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”last”]\n
<\/i><\/div>

Fade from right - delay: 800<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\n
<\/i><\/div>

Fade from bottom - delay: 400<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″]\n
<\/i><\/div>

Move up - delay: 800<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”last”]\n
<\/i><\/div>

Grow - delay: 1200<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\n
<\/i><\/div>

Helix - delay: 0<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″]\n
<\/i><\/div>

Flip - delay: 400<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”last”]\n
<\/i><\/div>

Pop up - delay: 800<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\n
<\/i><\/div>

Spin - delay: 0<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″]\n
<\/i><\/div>

Flip X - delay: 600<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”last”]\n
<\/i><\/div>

Flip Y - delay: 1200<\/h3>
\nVestibulum ante ipsum primis in fauc ibus orci luctus et ultrices posuere cubilia Curae; Integer in enim dui. Suspendisse potenti. Sed placerat pellentesque nibh ut varius. Morbi aliquet.
\n<\/div><\/div><\/div>\n[\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”]\n","protected":false},"excerpt":{"rendered":"

[spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”] Animate your icon boxes in any of the 9 different ways (see examples below). Animation will only occur on appear and you can also set the animation delay to synchronise how your content appears.\u00a0 Please note: Animations are disabled on tablet & mobile devices for a better experience. [\/spb_text_block] [blank_spacer height=”60px” width=”1\/1″ el_position=”first last”] […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":8303,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":{"footnotes":""},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/11189"}],"collection":[{"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/comments?post=11189"}],"version-history":[{"count":0,"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/11189\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/8303"}],"wp:attachment":[{"href":"https:\/\/joymarkfoundation.org\/index.php\/wp-json\/wp\/v2\/media?parent=11189"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}