{"id":1386,"date":"2017-02-13T15:05:23","date_gmt":"2017-02-13T15:05:23","guid":{"rendered":"http:\/\/test.kriesi.at\/enfold-2017\/?page_id=1386"},"modified":"2017-05-26T15:08:47","modified_gmt":"2017-05-26T13:08:47","slug":"image-with-hotspots","status":"publish","type":"page","link":"https:\/\/rotaryclub-narniamelia.it\/?page_id=1386","title":{"rendered":"Image with Hotspots"},"content":{"rendered":"<\/div><\/div><\/div><!-- close content main div --><\/div><\/div><div id='intro' class='avia-section main_color avia-section-default avia-no-border-styling avia-bg-style-scroll  container_wrap sidebar_right'   ><div class='container' ><div class='template-page content  av-content-small alpha units'><div class='post-entry post-entry-type-page post-entry-1386'><div class='entry-content-wrapper clearfix'>\n<div style='height:50px' class='hr hr-invisible '><span class='hr-inner ' ><span class='hr-inner-style'><\/span><\/span><\/div>\n<div style='padding-bottom:20px;color:#000000;font-size:40px;' class='av-special-heading av-special-heading-h1 custom-color-heading blockquote modern-quote modern-centered   av-inherit-size'><h1 class='av-special-heading-tag'  itemprop=\"headline\"  >Image with Hotspots<\/h1><div class='special-heading-border'><div class='special-heading-inner-border' style='border-color:#000000'><\/div><\/div><\/div>\n<div style=' margin-top:30px; margin-bottom:30px;'  class='hr hr-custom hr-center hr-icon-no '><span class='hr-inner   inner-border-av-border-fat' style=' width:50px; border-color:#000000;' ><span class='hr-inner-style'><\/span><\/span><\/div>\n<div class='av-hotspot-image-container avia_animate_when_almost_visible  avia_animated_image avia_animate_when_almost_visible bottom-to-top av-hotspot-numbered av-mobile-fallback-active  av-permanent-tooltip  av-non-fullwidth-hotspot-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' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Beautiful new demos with each release&lt;\/p&gt;\n' style='top: 13.7%; left: 27.8%; '><div class='av-image-hotspot_inner' style=' '>1<\/div><div class='av-image-hotspot-pulse' ><\/div><\/div><div class='av-image-hotspot' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Free Stock Pictures included in all demos&lt;\/p&gt;\n' style='top: 21%; left: 69.9%; '><div class='av-image-hotspot_inner' style=' '>2<\/div><div class='av-image-hotspot-pulse' ><\/div><\/div><div class='av-image-hotspot' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Retina ready and responsive &#8211; works great on devices of any\u00a0size&lt;\/p&gt;\n' style='top: 48.6%; left: 85.3%; '><div class='av-image-hotspot_inner' style=' '>3<\/div><div class='av-image-hotspot-pulse' ><\/div><\/div><div class='av-image-hotspot' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Amazing Theme Options for unlimited colors and styles&lt;\/p&gt;\n' style='top: 87.1%; left: 40.1%; '><div class='av-image-hotspot_inner' style=' '>4<\/div><div class='av-image-hotspot-pulse' ><\/div><\/div><div class='av-image-hotspot' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Powerful\u00a0Visual Layout Editor&lt;\/p&gt;\n' style='top: 63.2%; left: 11.3%; '><div class='av-image-hotspot_inner' style=' '>5<\/div><div class='av-image-hotspot-pulse' ><\/div><\/div><img class='avia_image ' src='https:\/\/rotaryclub-narniamelia.it\/wp-content\/uploads\/2015\/07\/multi_apple-1.jpg' alt='' title=''   itemprop=\"thumbnailUrl\"  \/><\/div><\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>1<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>Beautiful new demos with each release<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>2<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>Free Stock Pictures included in all demos<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>3<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>Retina ready and responsive &#8211; works great on devices of any\u00a0size<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>4<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>Amazing Theme Options for unlimited colors and styles<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>5<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>Powerful\u00a0Visual Layout Editor<\/p>\n<\/div><\/div><\/div>\n<div style='height:50px' class='hr hr-invisible '><span class='hr-inner ' ><span class='hr-inner-style'><\/span><\/span><\/div>\n<div class=\"flex_column av_one_half  av-animated-generic fade-in  flex_column_div av-zero-column-padding first  \" style='border-radius:0px; '><section class=\"av_textblock_section\"  itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/CreativeWork\" ><div class='avia_textblock '   itemprop=\"text\" ><p>The Image with Hotspots allows you to place either a fullwidth or content size image on the screen that has various hotspots (any number possible) which will be shown once the image scrolls into the browser vieport<\/p>\n<\/div><\/section><\/div><div class=\"flex_column av_one_half  av-animated-generic fade-in  flex_column_div av-zero-column-padding   \" style='border-radius:0px; '><section class=\"av_textblock_section\"  itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/CreativeWork\" ><div class='avia_textblock '   itemprop=\"text\" ><p>There are &#8211; as always &#8211; several color options, as well as options for each individual hotspot. For example how and when the text overlay should be shown.<\/p>\n<\/div><\/section><\/div>\n<\/div><\/div><\/div><!-- close content main div --><\/div><\/div><div id='after_section_1' class='main_color av_default_container_wrap container_wrap sidebar_right'   ><div class='container' ><div class='template-page content  av-content-small alpha units'><div class='post-entry post-entry-type-page post-entry-1386'><div class='entry-content-wrapper clearfix'>\n<div class='flex_column_table av-equal-height-column-flextable' ><div class=\"flex_column av_one_full  flex_column_table_cell av-equal-height-column av-align-middle av-zero-column-padding first  \" style='border-radius:0px; '><p><div class='av-hotspot-image-container avia_animate_when_almost_visible  avia_animated_image avia_animate_when_almost_visible fade-in av-hotspot-numbered av-mobile-fallback-active  av-permanent-tooltip  av-non-fullwidth-hotspot-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' data-avia-tooltip-position='top' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-above av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Tons of elements to build your site&lt;\/p&gt;\n' style='top: 18.8%; left: 62.5%; '><div class='av-image-hotspot_inner' style='background-color: #22689e; color: #ffffff;'>1<\/div><div class='av-image-hotspot-pulse' style='background-color:#22689e;'><\/div><\/div><div class='av-image-hotspot' data-avia-tooltip-position='right' data-avia-tooltip-alignment='centered' data-avia-tooltip-class='av-tt-large-width av-tt-pos-right av-tt-align-centered  av-mobile-fallback-active  av-permanent-tooltip-single  main_color av-tooltip-shadow av-tt-hotspot' data-avia-tooltip='&lt;p&gt;Canvas preview to build your layout&lt;\/p&gt;\n' style='top: 70.6%; left: 33.1%; '><div class='av-image-hotspot_inner' style='background-color: #22689e; color: #ffffff;'>2<\/div><div class='av-image-hotspot-pulse' style='background-color:#22689e;'><\/div><\/div><img class='avia_image ' src='https:\/\/rotaryclub-narniamelia.it\/wp-content\/uploads\/2017\/02\/features-builder-1.jpg' alt='' title=''   itemprop=\"thumbnailUrl\"  \/><\/div><\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>1<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>\nTons of elements to build your site<\/p>\n<\/div><\/div><div class='av-hotspot-fallback-tooltip'><div class='av-hotspot-fallback-tooltip-count'>2<div class='avia-arrow'><\/div><\/div><div class='av-hotspot-fallback-tooltip-inner clearfix'><p>\nCanvas preview to build your layout<\/p>\n<\/div><\/div><\/div><br \/>\n<section class=\"av_textblock_section\"  itemscope=\"itemscope\" itemtype=\"https:\/\/schema.org\/CreativeWork\" ><div class='avia_textblock '   itemprop=\"text\" ><p>Here you can see an example of a non-fulwidth image with hotspots. Also on this image with have set a different color for the hotspot. You can assign colors individually for each hotspot.<\/p>\n<\/div><\/section><\/p><\/div><\/div><!--close column table wrapper. Autoclose: 1 -->\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":606,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_themeisle_gutenberg_block_has_review":false,"footnotes":""},"class_list":["post-1386","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/pages\/1386","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1386"}],"version-history":[{"count":1,"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/pages\/1386\/revisions"}],"predecessor-version":[{"id":3193,"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/pages\/1386\/revisions\/3193"}],"up":[{"embeddable":true,"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=\/wp\/v2\/pages\/606"}],"wp:attachment":[{"href":"https:\/\/rotaryclub-narniamelia.it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1386"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}