Image with hotspots; close onclick

Hey Frans,

Thank you for the inquiry.

This is possible but you have modify one of the script files directly. Please check the following threads for more info.

// https://kriesi.at/support/topic/close-a-hot-spot-by-clicking-anywhere-away-from-it/#post-1277247
// https://kriesi.at/support/topic/image-hotspot-tooltips-with-click-again-again-2018/#post-1025216

Best regards,
Ismael

Hi,

Thank you for the update.

Have I placed the additional code correctly? (see screenshot)

You have to add the code below the first block.

if (this.options.event != 'click')
                {
                    this.scope.on('mouseleave', default_tooltips, $.proxy(this.hide_tooltip, this));
                    this.scope.on('click', default_tooltips, $.proxy(this.hide_on_click_tooltip, this));
                } else
                {
                    this.body.on('mousedown', $.proxy(this.hide_tooltip, this));
                }

                this.body.on('click', $.proxy(this.hide_all_tooltips, this));

You have to temporarily disable the Enfold > Performance > File Compression settings after doing the modification.

Best regards,
Ismael

Hi,

Thank you for following up.

We may need to login to the site in order to properly test the modification. Please provide the login details in the private field.

Best regards,
Ismael

Hi,

Thank you for the info.

Instead of editing the avia.js file, we just added this script in the functions.php file.

function av_hide_show_tooltips (){ ?>
    <script>
	(function( $ ) {
		$('body').on( "click", function(e) {
			$(this).children('.avia-tooltip').hide();
		});
	})(jQuery);
    </script>
<?php }
add_action('wp_footer', 'av_hide_show_tooltips');

This should hide all active tooltip when you click anywhere in the document.

Best regards,
Ismael

Hi,
Glad Ismael could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike