Icon Counter

[TS-VCSC-Spacer height=”20″]

ICON & IMAGE COUNTERS

SHOW YOUR PROGRESS IN A UNIQUE WAY

[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]

Counter Features:

[TS-VCSC-Spacer height=”20″][TS_VCSC_Fancy_List list_type=”image” marker_image=”http://www.mfdsgn.com/mf/wp-content/plugins/ts-visual-composer-extend/images/bullets/bullet_check_blue.png”]

  • Use fixed target value or dynamic value by using custom shortcode to return the desired value
  • Use image or icon font with counter
  • 3 icon/image position (top, bottom, left)
  • Determine colors for all segments individually
  • Set speed (duration) for counter animation (in ms)
  • Use custom pre- and postfixed for the animated value
  • Use thousand separator for animated value
  • Add tooltip to counter element
  • Add CSS3 hover animation to icon/image

[/TS_VCSC_Fancy_List]

[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”20″]

COUNTERS WITH IMAGES

SHOW YOUR PROGRESS IN A UNIQUE WAY

[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”21942″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”300″ counter_value_size=”50″ counter_seperator=”true” counter_note=”Beats per Minute” counter_note_size=”25″ height=”10″ counter_value=”256″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”21941″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”25″ counter_value_size=”50″ counter_seperator=”true” counter_note=”Days to go …” counter_note_size=”25″ height=”10″ counter_value=”256″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”21938″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”800″ counter_value_size=”50″ counter_seperator=”true” counter_note=”Packages Delivered” counter_note_size=”25″ height=”10″ counter_value=”256″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”right” icon_replace=”true” icon_image=”21939″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”185″ counter_value_size=”50″ counter_seperator=”true” counter_note=”Miles per Hour” counter_note_size=”25″ height=”10″ counter_value=”185″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”right” icon_replace=”true” icon_image=”7085″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”500000″ counter_value_size=”50″ counter_value_format=”true” counter_value_plus=”true” counter_value_seperator=”,” counter_seperator=”true” counter_note=”Flyer Miles” counter_note_size=”25″ height=”10″ counter_value=”185″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”right” icon_replace=”true” icon_image=”7088″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”178″ counter_value_size=”50″ counter_seperator=”true” counter_note=”Bright Ideas” counter_note_size=”25″ height=”10″ counter_value=”185″ icon_align=”none” tooltip_css=”false”]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”20″]

COUNTERS WITH FONT ICONS

SHOW YOUR PROGRESS IN A UNIQUE WAY

[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Icon-Counter icon=”fa fa-medkit” icon_color=”#dd0000″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”468″ counter_note=”Days without Accident” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon=”fa fa-archive” icon_color=”#a8a8a8″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”2483″ counter_value_format=”true” counter_value_seperator=”,” counter_note=”Files in Archive” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon=”fa fa-code” icon_color=”#2e7f27″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”10453″ counter_value_format=”true” counter_value_seperator=”,” counter_note=”Lines of Code” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon=”fa fa-comments-o” icon_color=”#1855a5″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”2300″ counter_value_format=”true” counter_value_plus=”true” counter_value_seperator=”,” counter_note=”Conversations” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon=”fa fa-gamepad” icon_color=”#fcd123″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”100″ counter_value_format=”true” counter_value_plus=”true” counter_note=”Hours of Playtime” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon=”fa fa-bug” icon_color=”#000000″ icon_background=”#ffffff” counter_value_start=”0″ counter_value_end=”129″ counter_note=”Bugs Fixed” tooltip_css=”false”]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”20″]

COUNTERS WITH PRE & POST FIXES

SHOW YOUR PROGRESS IN A UNIQUE WAY

[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Spacer height=”40″]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”7059″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”500000″ counter_value_format=”true” counter_value_seperator=”,” counter_value_before=”$” counter_seperator=”true” counter_note=”Funds Raised” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”7058″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”28″ counter_value_format=”true” counter_value_before=”+” counter_value_after=”%” counter_seperator=”true” counter_note=”Increase Fuel Economy” tooltip_css=”false”]
[TS-VCSC-Icon-Counter icon_position=”left” icon_replace=”true” icon_image=”7057″ icon_size_slide=”100″ counter_value_start=”0″ counter_value_end=”1100″ counter_value_format=”true” counter_value_seperator=”,” counter_value_after=” ºF” counter_seperator=”true” counter_note=”Fire Resistancy” tooltip_css=”false”]
[TS-VCSC-Spacer height=”40″]