{"id":3192,"date":"2014-07-08T17:58:03","date_gmt":"2014-07-08T17:58:03","guid":{"rendered":"http:\/\/www.kriesi.at\/themes\/enfold\/?page_id=3192"},"modified":"2014-07-08T17:58:03","modified_gmt":"2014-07-08T17:58:03","slug":"images-with-hotspots","status":"publish","type":"page","link":"https:\/\/dalman.ro\/?page_id=3192","title":{"rendered":"Images with Hotspots"},"content":{"rendered":"\n<style type=\"text\/css\" data-created_by=\"avia_inline_auto\" id=\"style-css-sub-av-av_image_hotspot-f8f436ff467e49a31d70d1f823a93400\">\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-a6bd31952ba5fc3f70a0a8232fa0890f{\ntop:60.4%;\nleft:12.5%;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-fbe93e30cf2431ea5b03e9b7c644ca46{\ntop:25.5%;\nleft:59%;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-a134fddb4814970babcd60fb5d68174e{\ntop:67.4%;\nleft:69.5%;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-a134fddb4814970babcd60fb5d68174e .av-image-hotspot_inner{\nbackground-color:#000000;\ncolor:#ffffff;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-a134fddb4814970babcd60fb5d68174e .av-image-hotspot-pulse{\nbackground-color:#1e73be;\n}\n<\/style>\n<div  class='av-hotspot-image-container av-av_image_hotspot-f8f436ff467e49a31d70d1f823a93400  avia-builder-el-0  el_before_av_heading  avia-builder-el-first  av-hotspot-numbered avia_animated_image avia_animate_when_almost_visible fade-in av-mobile-fallback-active  av-non-fullwidth-hotspot-image'  itemprop=\"image\" itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/ImageObject\" ><div class='av-hotspot-container'><div class='av-hotspot-container-inner-cell'><div class='av-hotspot-container-inner-wrap'><div class='av-image-hotspot av-av_image_spot-a6bd31952ba5fc3f70a0a8232fa0890f av-image-hotspot-1 ' data-avia-tooltip-position='right' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-default-width av-tt-pos-right av-tt-align-centered  av-mobile-fallback-active  main_color av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Place any number of tooltips on the image&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>1<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><div class='av-image-hotspot av-av_image_spot-fbe93e30cf2431ea5b03e9b7c644ca46 av-image-hotspot-2 ' data-avia-tooltip-position='bottom' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-xlarge-width av-tt-pos-below av-tt-align-centered  av-mobile-fallback-active  main_color av-tt-hotspot' data-avia-tooltip='&lt;p&gt;You can change styling, size and position of each of the tooltips to your likings&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>2<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><div class='av-image-hotspot av-av_image_spot-a134fddb4814970babcd60fb5d68174e av-image-hotspot-3 ' data-avia-tooltip-position='top' data-avia-tooltip-alignment='left' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-left  av-mobile-fallback-active  transparent_dark av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Here is an example of a tooltip with a different color scheme&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>3<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><img decoding=\"async\" fetchpriority=\"high\" class='wp-image-315 avia-img-lazy-loading-not-315 avia_image' src=\"https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/014-1000x430.jpg\" alt='' title='014'  height=\"430\" width=\"1000\"  itemprop=\"thumbnailUrl\"  \/><\/div><\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-1 '><div class=\"av-hotspot-fallback-tooltip-count\">1<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nPlace any number of tooltips on the image<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-2 '><div class=\"av-hotspot-fallback-tooltip-count\">2<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nYou can change styling, size and position of each of the tooltips to your likings<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-3 '><div class=\"av-hotspot-fallback-tooltip-count\">3<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nHere is an example of a tooltip with a different color scheme<\/p>\n<\/div><\/div><\/div>\n\n<style type=\"text\/css\" data-created_by=\"avia_inline_auto\" id=\"style-css-av-av_heading-750fc4f51e20aaa59d6a7caa77e45416\">\n#top .av-special-heading.av-av_heading-750fc4f51e20aaa59d6a7caa77e45416{\npadding-bottom:10px;\n}\nbody .av-special-heading.av-av_heading-750fc4f51e20aaa59d6a7caa77e45416 .av-special-heading-tag .heading-char{\nfont-size:25px;\n}\n.av-special-heading.av-av_heading-750fc4f51e20aaa59d6a7caa77e45416 .av-subheading{\nfont-size:15px;\n}\n<\/style>\n<div  class='av-special-heading av-av_heading-750fc4f51e20aaa59d6a7caa77e45416 av-special-heading-h1 blockquote modern-quote modern-centered  avia-builder-el-1  el_after_av_image_hotspot  el_before_av_textblock  avia-builder-el-first  av-thin-font'><h1 class='av-special-heading-tag'  itemprop=\"headline\"  >Images <strong>with Tooltips<\/strong><\/h1><div class=\"special-heading-border\"><div class=\"special-heading-inner-border\"><\/div><\/div><\/div>\n<section  class='av_textblock_section av-av_textblock-2989cb1a500f76248ec894598f4e8e5e '   itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/CreativeWork\" ><div class='avia_textblock'  itemprop=\"text\" ><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.<\/p>\n<p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.<\/p>\n<\/div><\/section>\n<div  class='flex_column av-av_one_half-2a9015ff38129c418a3f2eafba3e9512 av_one_half  avia-builder-el-3  el_after_av_textblock  el_before_av_one_half  first flex_column_div  column-top-margin'     ><style type=\"text\/css\" data-created_by=\"avia_inline_auto\" id=\"style-css-sub-av-av_image_hotspot-2bf07d31b5a545ea56a4a2c7f306609e\">\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-a6e2027fb74808427454c5e37be5fb0f{\ntop:43.7%;\nleft:47.5%;\n}\n<\/style>\n<div  class='av-hotspot-image-container av-av_image_hotspot-2bf07d31b5a545ea56a4a2c7f306609e  avia-builder-el-4  avia-builder-el-no-sibling  av-hotspot-numbered avia_animated_image avia_animate_when_almost_visible left-to-right av-mobile-fallback-active  av-non-fullwidth-hotspot-image'  itemprop=\"image\" itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/ImageObject\" ><div class='av-hotspot-container'><div class='av-hotspot-container-inner-cell'><div class='av-hotspot-container-inner-wrap'><div class='av-image-hotspot av-av_image_spot-a6e2027fb74808427454c5e37be5fb0f av-image-hotspot-1 ' data-avia-tooltip-position='right' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-default-width av-tt-pos-right av-tt-align-centered  av-mobile-fallback-active  main_color av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Place any number of tooltips on the image&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>1<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><img decoding=\"async\" fetchpriority=\"high\" class='wp-image-316 avia-img-lazy-loading-not-316 avia_image' src=\"https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/2-300x195.jpg\" alt='' title='2'  height=\"195\" width=\"300\"  itemprop=\"thumbnailUrl\" srcset=\"https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/2-300x195.jpg 300w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/2-768x499.jpg 768w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/2-705x458.jpg 705w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/2.jpg 1000w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/div><\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-1 '><div class=\"av-hotspot-fallback-tooltip-count\">1<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nPlace any number of tooltips on the image<\/p>\n<\/div><\/div><\/div><\/div>\n<div  class='flex_column av-av_one_half-52c89597409f646e66e7cc675a5d9b4a av_one_half  avia-builder-el-5  el_after_av_one_half  el_before_av_textblock  flex_column_div  column-top-margin'     ><style type=\"text\/css\" data-created_by=\"avia_inline_auto\" id=\"style-css-sub-av-av_image_hotspot-d40b5d46c2ecda43ada4ad2842f1e43d\">\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-6c3973a51b0921b9b8089ea877e8f546{\ntop:28.3%;\nleft:17.5%;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-82b7ab8f48ec744fc6619fa00836f1b4{\ntop:57.7%;\nleft:83.5%;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-82b7ab8f48ec744fc6619fa00836f1b4 .av-image-hotspot_inner{\nbackground-color:#000000;\ncolor:#ffffff;\n}\n.av-hotspot-image-container .av-image-hotspot.av-av_image_spot-82b7ab8f48ec744fc6619fa00836f1b4 .av-image-hotspot-pulse{\nbackground-color:#aa1b1b;\n}\n<\/style>\n<div  class='av-hotspot-image-container av-av_image_hotspot-d40b5d46c2ecda43ada4ad2842f1e43d  avia-builder-el-6  avia-builder-el-no-sibling  av-hotspot-numbered avia_animated_image avia_animate_when_almost_visible pop-up av-mobile-fallback-active  av-non-fullwidth-hotspot-image'  itemprop=\"image\" itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/ImageObject\" ><div class='av-hotspot-container'><div class='av-hotspot-container-inner-cell'><div class='av-hotspot-container-inner-wrap'><div class='av-image-hotspot av-av_image_spot-6c3973a51b0921b9b8089ea877e8f546 av-image-hotspot-1 ' data-avia-tooltip-position='right' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-default-width av-tt-pos-right av-tt-align-centered  av-mobile-fallback-active  main_color av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Place any number of tooltips on the image&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>1<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><div class='av-image-hotspot av-av_image_spot-82b7ab8f48ec744fc6619fa00836f1b4 av-image-hotspot-2 ' data-avia-tooltip-position='top' data-avia-tooltip-alignment='left' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-left  av-mobile-fallback-active  transparent_dark av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Here is an example of a tooltip with a different color scheme&lt;\/p&gt;\n'><div class='av-image-hotspot_inner'>2<\/div><div class='av-image-hotspot-pulse'><\/div><\/div><img decoding=\"async\" fetchpriority=\"high\" class='wp-image-314 avia-img-lazy-loading-not-314 avia_image' src=\"https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/013-300x195.jpg\" alt='' title='013'  height=\"195\" width=\"300\"  itemprop=\"thumbnailUrl\" srcset=\"https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/013-300x195.jpg 300w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/013-768x499.jpg 768w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/013-705x458.jpg 705w, https:\/\/dalman.ro\/wp-content\/uploads\/2012\/04\/013.jpg 1000w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/div><\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-1 '><div class=\"av-hotspot-fallback-tooltip-count\">1<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nPlace any number of tooltips on the image<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip av-image-hotspot-2 '><div class=\"av-hotspot-fallback-tooltip-count\">2<div class=\"avia-arrow\"><\/div><\/div><div class=\"av-hotspot-fallback-tooltip-inner clearfix\"><p>\nHere is an example of a tooltip with a different color scheme<\/p>\n<\/div><\/div><\/div><\/div>\n<section  class='av_textblock_section av-av_textblock-2989cb1a500f76248ec894598f4e8e5e '   itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/CreativeWork\" ><div class='avia_textblock'  itemprop=\"text\" ><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.<\/p>\n<p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.<\/p>\n<\/div><\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":750,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":{"footnotes":""},"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/pages\/3192"}],"collection":[{"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dalman.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3192"}],"version-history":[{"count":0,"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/pages\/3192\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/dalman.ro\/index.php?rest_route=\/wp\/v2\/pages\/750"}],"wp:attachment":[{"href":"https:\/\/dalman.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}