Animated Milestone - Security Design
2060
page-template-default,page,page-id-2060,page-child,parent-pageid-121,theme-bridge,woocommerce-no-js,ajax_fade,page_not_loaded,,columns-4,qode-theme-ver-16.7,qode-theme-bridge,wpb-js-composer js-comp-ver-4.12,vc_responsive
 

Animated Milestone

Milestone

[tabs]
[tab title=”Parameters” icon=”check” icon_color=”#3cabce”]

Parameters

[divider_line]

[list icon=”check” color=”blue”]

  • numberFrom(optional)
  • number(optional)
  • subject
  • size:small,default,large
  • numberColor:(optional)
  • subjectColor(optional)
  • icon:(optional)
  • iconColor(optional)

[/list]
[/tab]
[tab title=”Option Panel” icon=”check” icon_color=”#3cabce”]

Shortcode Option Panel

[divider_line]
[image source_type=”attachment_id” source_value=”3225″ caption=”The Animated Milestone Shortcode Options Panel” alt=”The Animated Milestone Shortcode Options Panel” align=”center” icon=”zoom” width=”594″ autoHeight=”true” quality=”100″ lightbox=”true” title=”The Animated Milestone Shortcode Options Panel”]
[/tab]
[/tabs]

[divider_padding]

Milestones with Different Size

[divider_line]
[one_third]
[milestone numberFrom=”45″ number=”98″ subject=”Small Size” size=”small”]
[/one_third]
[one_third]
[milestone numberFrom=”99″ number=”231″ subject=”Medium Size”]
[/one_third]
[one_third_last]
[milestone numberFrom=”232″ number=”321″ subject=”Large Size” size=”large”]
[/one_third_last]

[toggle title=”Get the code”]
[code]
[one_third]
[milestone numberFrom=”45″ number=”98″ subject=”Small Size” size=”small”]
[/one_third]
[one_third]
[milestone numberFrom=”99″ number=”231″ subject=”Medium Size”]
[/one_third]
[one_third_last]
[milestone numberFrom=”232″ number=”321″ subject=”Large Size” size=”large”]
[/one_third_last]
[/code]
[/toggle]

[divider_padding]

Milestones with Custom Color

[divider_line]
[one_third]
[milestone numberFrom=”5″ number=”198″ subject=”Custom Number Color” numberColor=”#27ccc0″]
[/one_third]
[one_third]
[milestone numberFrom=”5″ number=”352″ subject=”Custom Subject Color” subjectColor=”#2ac4ea” ]
[/one_third]
[one_third_last]
[milestone numberFrom=”5″ number=”246″ subject=”Custom Color” numberColor=”#f6653c” subjectColor=”#27ccc0″ ]
[/one_third_last]

[toggle title=”Get the code”]
[code]
[one_third]
[milestone numberFrom=”5″ number=”198″ subject=”Custom Number Color” numberColor=”#27ccc0″]
[/one_third]
[one_third]
[milestone numberFrom=”5″ number=”352″ subject=”Custom Subject Color” subjectColor=”#2ac4ea” ]
[/one_third]
[one_third_last]
[milestone numberFrom=”5″ number=”246″ subject=”Custom Color” numberColor=”#f6653c” subjectColor=”#27ccc0″ ]
[/one_third_last]
[/code]
[/toggle]

[divider_padding]

Icon Milestones

[divider_line]
[one_half]
[milestone numberFrom=”100″ number=”15698″ subject=”Satisfied users” icon=”smile-o”]
[/one_half]
[one_half_last]
[milestone numberFrom=”100″ number=”1539″ subject=”Bugs fixed” icon=”bug”]
[/one_half_last]

[toggle title=”Get the code”]
[code]
[one_half]
[milestone numberFrom=”100″ number=”15698″ subject=”Satisfied users” icon=”smile-o”]
[/one_half]
[one_half_last]
[milestone numberFrom=”100″ number=”1539″ subject=”Bugs fixed” icon=”bug”]
[/one_half_last]
[/code]
[/toggle]

[divider_padding]

Icon Milestones With Custom Color

[divider_line]
[one_third]
[milestone numberFrom=”45″ number=”98″ subject=”Small Size” size=”small” icon=”lightbulb-o” iconColor=”#f6653c”]
[/one_third]
[one_third]
[milestone numberFrom=”99″ number=”231″ subject=”with Icon” size=”small” icon=”leaf” iconColor=”#2ac4ea”]
[/one_third]
[one_third_last]
[milestone numberFrom=”232″ number=”321″ subject=”Custom Icon Color” size=”small” icon=”pencil” iconColor=”#27ccc0″]
[/one_third_last]

[toggle title=”Get the code”]
[code]
[one_third]
[milestone numberFrom=”45″ number=”98″ subject=”Small Size” size=”small” icon=”lightbulb-o” iconColor=”#f6653c”]
[/one_third]
[one_third]
[milestone numberFrom=”99″ number=”231″ subject=”with Icon” size=”small” icon=”leaf” iconColor=”#2ac4ea”]
[/one_third]
[one_third_last]
[milestone numberFrom=”232″ number=”321″ subject=”Custom Icon Color” size=”small” icon=”pencil” iconColor=”#27ccc0″]
[/one_third_last]
[/code]
[/toggle]

[divider_top]