We hand pick the best services from our extensive design and development toolkit to create amazing tooltips and popovers with great options.
[kleo_divider type=”long” position=”center” text=”Tooltips attached to buttons”][kleo_gap size=”20px”]
[kleo_button title=”Tooltip on right” style=”default” tooltip=”tooltip” tooltip_position=”right” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover”]
[kleo_button title=”Tooltip on top” style=”default” tooltip=”tooltip” tooltip_position=”top” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover”]
[kleo_button title=”Tooltip on hover” style=”default” tooltip=”tooltip” tooltip_position=”bottom” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover”]
[kleo_button title=”Tooltip on left” style=”default” tooltip=”tooltip” tooltip_position=”left” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover”]
[kleo_divider type=”long” position=”center” text=”Tooltips attached to pins & icons”][kleo_gap size=”20px”]
[kleo_pin type=”circle” icon=”doc” tooltip=”tooltip” tooltip_position=”right” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover” css_animation=”el-appear” animation=”animate-when-almost-visible” top=”20px” right=”30px”]
[kleo_pin type=”circle” tooltip=”tooltip” tooltip_position=”top” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover” css_animation=”pulsate” animation=”animate-when-almost-visible” top=”20px” right=”30px”]
[kleo_icon icon=”folder-empty” tooltip=”tooltip” tooltip_position=”top” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover” icon_size=”2x”]
Attached to an icon
[kleo_icon icon=”doc” icon_size=”2x” tooltip=”tooltip” tooltip_position=”top” tooltip_title=”Tooltips are great for short infos” tooltip_action=”hover”]
Attached to an icon
[kleo_divider type=”long” position=”center” text=”Popovers attached to buttons”][kleo_gap size=”20px”]
[kleo_button title=”Popover on right” style=”default” tooltip=”popover” tooltip_position=”right” tooltip_title=”Popovers are great for additional infos” tooltip_action=”hover” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.”]
[kleo_button title=”Popover on top” style=”default” tooltip=”popover” tooltip_position=”top” tooltip_title=”Popover title” tooltip_action=”hover” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry.”]
[kleo_button title=”Popover on hover” style=”default” tooltip=”popover” tooltip_position=”bottom” tooltip_title=”Popover title” tooltip_action=”hover” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry.”]
[kleo_button title=”Popover on click” style=”default” tooltip=”popover” tooltip_position=”left” tooltip_title=”Popover title” tooltip_action=”click” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry. Ut enim ad minim veniam, quis nostrud exercitation ullamco”]
[kleo_divider type=”long” position=”center” text=”Popovers attached to pins & icons”][kleo_gap size=”20px”]
[kleo_pin type=”circle” icon=”doc” tooltip=”popover” tooltip_position=”right” tooltip_title=”Popovers are great for additional infos” tooltip_action=”hover” css_animation=”el-appear” animation=”animate-when-almost-visible” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s” top=”20px” right=”30px”]
[kleo_pin type=”circle” tooltip=”popover” tooltip_position=”top” tooltip_title=”Popover title” tooltip_action=”hover” css_animation=”pulsate” animation=”animate-when-almost-visible” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry” top=”20px” right=”30px”]
[kleo_icon icon=”folder-empty” icon_size=”2x” tooltip=”popover” tooltip_position=”top” tooltip_title=”Popover title” tooltip_action=”hover” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry”]
Attached to an icon
[kleo_icon icon=”doc” icon_size=”2x” tooltip=”popover” tooltip_position=”top” tooltip_title=”Popover title” tooltip_action=”hover” tooltip_text=”Lorem Ipsum is simply dummy text of the printing and typesetting industry”]
