{"id":33722,"date":"2018-09-09T12:08:35","date_gmt":"2018-09-09T06:08:35","guid":{"rendered":"https:\/\/www.elementpack.pro\/demo\/?page_id=33722"},"modified":"2026-03-15T12:51:12","modified_gmt":"2026-03-15T06:51:12","slug":"widget-tooltip","status":"publish","type":"page","link":"https:\/\/www.elementpack.pro\/demo\/element\/widget-tooltip\/","title":{"rendered":"Widget Tooltip"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"33722\" class=\"elementor elementor-33722\" data-elementor-settings=\"{&quot;element_pack_global_tooltip_width&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_padding&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true}}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7e481679 e-flex e-con-boxed magic-button-disabled-no e-con e-parent\" data-id=\"7e481679\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-242ab5d9 bdt-backdrop-filter-yes e-flex e-con-boxed bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"242ab5d9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-225af453 elementor-widget__width-auto elementor-widget-tablet__width-initial elementor-widget elementor-widget-bdt-advanced-heading\" data-id=\"225af453\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"bdt-advanced-heading.default\">\n\t\t\t\t\t<div id=\"225af453\" class=\"bdt-ep-advanced-heading\" data-settings=\"{&quot;titleMultiColor&quot;:&quot;no&quot;}\"><h2 class=\"bdt-ep-advanced-heading-title\"><span class=\"bdt-ep-advanced-heading-main-title\"><span class=\"bdt-ep-advanced-heading-main-title-inner\">Demo 01 : <\/span><span class=\"bdt-mainh-split-text\">Tooltip Placement<\/span><\/span><\/h2><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-71c78d2 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"71c78d2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tYou may go ahead and place the tooltip anywhere around the item as long as it\u2019s inside the page. Here\u2019s the how it looks like in different positions\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1503af23 bdt-backdrop-filter-yes e-con-full e-flex bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"1503af23\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-522159bd e-grid e-con-full magic-button-disabled-no e-con e-child\" data-id=\"522159bd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-18c359e1 bdt-icon-type-image elementor-position-top bdt-icon-effect-none elementor-widget elementor-widget-bdt-advanced-icon-box\" data-id=\"18c359e1\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Top Aligned Tooltip&quot;,&quot;element_pack_widget_tooltip_arrow&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"bdt-advanced-icon-box.default\">\n\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box\">\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-icon\">\n\t\t\t\t<span class=\"bdt-ep-advanced-icon-box-icon-wrap\">\n\n\n\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment.png\" class=\"attachment-full size-full\" alt=\"Top Aligned Tooltip\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/beauty-treatment-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\n\t\t\t\t\n\t\t\t<div class=\"bdt-ep-advanced-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"bdt-ep-advanced-icon-box-title ep-title-\">\n\t\t\t<span >\n\t\t\t\tTop Aligned Tooltip\t\t\t<\/span>\n\t\t<\/h3>\n\t\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-description\">\n\t\t\t\t\t\t<p>Show the tooltip above the element. Use Top for center alignment, Top Start for left alignment.<\/p>\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-130356bd bdt-icon-type-image elementor-position-top bdt-icon-effect-none elementor-widget elementor-widget-bdt-advanced-icon-box\" data-id=\"130356bd\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Right Aligned Tooltip&quot;,&quot;element_pack_widget_tooltip_placement&quot;:&quot;right&quot;,&quot;element_pack_widget_tooltip_arrow&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"bdt-advanced-icon-box.default\">\n\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box\">\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-icon\">\n\t\t\t\t<span class=\"bdt-ep-advanced-icon-box-icon-wrap\">\n\n\n\t\t\t\t\t<img decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water.png\" class=\"attachment-full size-full\" alt=\"Right Aligned Tooltip\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pure-water-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\n\t\t\t\t\n\t\t\t<div class=\"bdt-ep-advanced-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"bdt-ep-advanced-icon-box-title ep-title-\">\n\t\t\t<span >\n\t\t\t\tRight Aligned Tooltip\t\t\t<\/span>\n\t\t<\/h3>\n\t\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-description\">\n\t\t\t\t\t\t<p>Show the tooltip to the right of the element. Use Right for center alignment, Right Start for top alignment.<\/p>\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-32167b2e bdt-icon-type-image elementor-position-top bdt-icon-effect-none elementor-widget elementor-widget-bdt-advanced-icon-box\" data-id=\"32167b2e\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Left Aligned Tooltip&quot;,&quot;element_pack_widget_tooltip_placement&quot;:&quot;left&quot;,&quot;element_pack_widget_tooltip_arrow&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"bdt-advanced-icon-box.default\">\n\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box\">\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-icon\">\n\t\t\t\t<span class=\"bdt-ep-advanced-icon-box-icon-wrap\">\n\n\n\t\t\t\t\t<img decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask.png\" class=\"attachment-full size-full\" alt=\"Left Aligned Tooltip\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/facial-mask-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\n\t\t\t\t\n\t\t\t<div class=\"bdt-ep-advanced-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"bdt-ep-advanced-icon-box-title ep-title-\">\n\t\t\t<span >\n\t\t\t\tLeft Aligned Tooltip\t\t\t<\/span>\n\t\t<\/h3>\n\t\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-description\">\n\t\t\t\t\t\t<p>Show the tooltip to the left of the element. Use Left for center alignment, Left Start for top alignment.<\/p>\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2dfab818 bdt-icon-type-image elementor-position-top bdt-icon-effect-none elementor-widget elementor-widget-bdt-advanced-icon-box\" data-id=\"2dfab818\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Bottom Aligned Tooltip&quot;,&quot;element_pack_widget_tooltip_placement&quot;:&quot;bottom&quot;,&quot;element_pack_widget_tooltip_arrow&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"bdt-advanced-icon-box.default\">\n\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box\">\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-icon\">\n\t\t\t\t<span class=\"bdt-ep-advanced-icon-box-icon-wrap\">\n\n\n\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution.png\" class=\"attachment-full size-full\" alt=\"Bottom Aligned Tooltip\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/soil-pollution-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\n\t\t\t\t\n\t\t\t<div class=\"bdt-ep-advanced-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"bdt-ep-advanced-icon-box-title ep-title-\">\n\t\t\t<span >\n\t\t\t\tBottom Aligned Tooltip\t\t\t<\/span>\n\t\t<\/h3>\n\t\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"bdt-ep-advanced-icon-box-description\">\n\t\t\t\t\t\t<p>Show the tooltip below the element. Use Bottom for center alignment, Bottom Start for left alignment.<\/p>\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-70391898 e-flex e-con-boxed magic-button-disabled-no e-con e-parent\" data-id=\"70391898\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5d890b1f bdt-backdrop-filter-yes e-flex e-con-boxed bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"5d890b1f\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a78bb24 elementor-widget__width-auto elementor-widget-tablet__width-initial elementor-widget elementor-widget-bdt-advanced-heading\" data-id=\"3a78bb24\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"bdt-advanced-heading.default\">\n\t\t\t\t\t<div id=\"3a78bb24\" class=\"bdt-ep-advanced-heading\" data-settings=\"{&quot;titleMultiColor&quot;:&quot;no&quot;}\"><h2 class=\"bdt-ep-advanced-heading-title\"><span class=\"bdt-ep-advanced-heading-main-title\"><span class=\"bdt-ep-advanced-heading-main-title-inner\">Demo 02: <\/span><span class=\"bdt-mainh-split-text\">Tooltip Animation<\/span><\/span><\/h2><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37c11ce elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"37c11ce\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tShows informative tooltips smoothly on hover, enhancing usability and guiding users effectively.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4d898768 bdt-backdrop-filter-yes e-con-full e-flex bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"4d898768\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-7fc4de1f e-con-full e-flex magic-button-disabled-no e-con e-child\" data-id=\"7fc4de1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-64ec986b elementor-widget__width-initial elementor-absolute elementor-widget elementor-widget-image\" data-id=\"64ec986b\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Brazil, a South American country famous for the Amazon, Carnival, and diverse landscapes.&quot;,&quot;element_pack_widget_tooltip_animation&quot;:&quot;perspective&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png\" class=\"attachment-full size-full wp-image-167439\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1697f09d elementor-widget__width-initial elementor-absolute elementor-hidden-mobile elementor-widget elementor-widget-image\" data-id=\"1697f09d\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;The United States of America, commonly known as the USA, located in North America.&quot;,&quot;element_pack_widget_tooltip_animation&quot;:&quot;fill&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png\" class=\"attachment-full size-full wp-image-167439\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2846e35e elementor-widget__width-initial elementor-absolute elementor-widget elementor-widget-image\" data-id=\"2846e35e\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;China, an East Asian country famous for the Great Wall, rich culture, and innovation.&quot;,&quot;element_pack_widget_tooltip_animation&quot;:&quot;shift-toward&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png\" class=\"attachment-full size-full wp-image-167439\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5ba9207b elementor-widget__width-initial elementor-absolute elementor-hidden-mobile elementor-widget elementor-widget-image\" data-id=\"5ba9207b\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_text&quot;:&quot;Saudi Arabia, located in the Middle East, famous for Mecca, deserts, and culture.&quot;,&quot;element_pack_widget_tooltip_animation&quot;:&quot;scale&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png\" class=\"attachment-full size-full wp-image-167439\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin.png 512w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-300x300.png 300w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-150x150.png 150w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-12x12.png 12w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-485x485.png 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/pin-100x100.png 100w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-122f8618 elementor-widget elementor-widget-spacer\" data-id=\"122f8618\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3067764b e-flex e-con-boxed magic-button-disabled-no e-con e-parent\" data-id=\"3067764b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-17e9d461 bdt-backdrop-filter-yes e-flex e-con-boxed bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"17e9d461\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f54b48 elementor-widget__width-auto elementor-widget-tablet__width-initial elementor-widget elementor-widget-bdt-advanced-heading\" data-id=\"8f54b48\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"bdt-advanced-heading.default\">\n\t\t\t\t\t<div id=\"8f54b48\" class=\"bdt-ep-advanced-heading\" data-settings=\"{&quot;titleMultiColor&quot;:&quot;no&quot;}\"><h2 class=\"bdt-ep-advanced-heading-title\"><span class=\"bdt-ep-advanced-heading-main-title\"><span class=\"bdt-ep-advanced-heading-main-title-inner\">Demo 03 : <\/span><span class=\"bdt-mainh-split-text\">Tooltip trigger hover effect<\/span><\/span><\/h2><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1462b562 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"1462b562\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tShows informative tooltips smoothly on hover, enhancing usability and guiding users effectively.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7dc2ccc9 bdt-backdrop-filter-yes e-con-full e-flex bdt-filter-backdrop magic-button-disabled-no e-con e-child\" data-id=\"7dc2ccc9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-2c0b2ce6 e-grid e-con-full magic-button-disabled-no e-con e-child\" data-id=\"2c0b2ce6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-54d66eff elementor-widget elementor-widget-image\" data-id=\"54d66eff\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip_text&quot;:&quot;Shows informative tooltips smoothly when hovering over interactive elements.&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_follow_cursor&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"922\" height=\"1024\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-922x1024.webp\" class=\"attachment-large size-large wp-image-167452\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-922x1024.webp 922w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-270x300.webp 270w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-768x853.webp 768w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-11x12.webp 11w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02-485x539.webp 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_02.webp 1080w\" sizes=\"(max-width: 922px) 100vw, 922px\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Sticky Tooltip on Hover<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4665f454 elementor-widget elementor-widget-image\" data-id=\"4665f454\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip_text&quot;:&quot;Shows informative tooltips smoothly when hovering over interactive elements.&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"922\" height=\"1024\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-922x1024.webp\" class=\"attachment-large size-large wp-image-167454\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-922x1024.webp 922w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-270x300.webp 270w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-768x853.webp 768w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-11x12.webp 11w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image-485x539.webp 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image.webp 1080w\" sizes=\"(max-width: 922px) 100vw, 922px\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Tooltip on Mouse Hover<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4331e9d4 elementor-widget elementor-widget-image\" data-id=\"4331e9d4\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;element_pack_widget_tooltip_text&quot;:&quot;Shows informative tooltips smoothly when hovering over interactive elements.&quot;,&quot;element_pack_widget_tooltip&quot;:&quot;yes&quot;,&quot;element_pack_widget_tooltip_trigger&quot;:&quot;click&quot;,&quot;element_pack_widget_tooltip_x_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_widget_tooltip_y_offset&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"922\" height=\"1024\" src=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-922x1024.webp\" class=\"attachment-large size-large wp-image-167456\" alt=\"\" srcset=\"https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-922x1024.webp 922w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-270x300.webp 270w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-768x853.webp 768w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-11x12.webp 11w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03-485x539.webp 485w, https:\/\/www.elementpack.pro\/demo\/wp-content\/uploads\/2026\/02\/Image_03.webp 1080w\" sizes=\"(max-width: 922px) 100vw, 922px\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">Tooltip on Click<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Demo 01 : Tooltip Placement You may go ahead and place the tooltip anywhere around the item as long as it\u2019s inside the page. Here\u2019s the how it looks like in different positions Top Aligned Tooltip Show the tooltip above the element. Use Top for center alignment, Top Start for left alignment. Right Aligned Tooltip Show the tooltip to the right of the element. Use Right for center alignment, Right Start for top alignment. Left Aligned Tooltip Show the tooltip to the left of the element. Use Left for center alignment, Left Start for top alignment. Bottom Aligned Tooltip Show the tooltip below the element. Use Bottom for center alignment, Bottom Start for left alignment. Demo 02: Tooltip Animation Shows informative tooltips smoothly on hover, enhancing usability and guiding users effectively. Demo 03 : Tooltip trigger hover effect Shows informative tooltips smoothly on hover, enhancing usability and guiding users effectively. Sticky Tooltip on Hover Tooltip on Mouse Hover Tooltip on Click<\/p>\n","protected":false},"author":6974,"featured_media":0,"parent":32,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-33722","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/pages\/33722","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/users\/6974"}],"replies":[{"embeddable":true,"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/comments?post=33722"}],"version-history":[{"count":0,"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/pages\/33722\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/pages\/32"}],"wp:attachment":[{"href":"https:\/\/www.elementpack.pro\/demo\/wp-json\/wp\/v2\/media?parent=33722"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}