Close all Highslide on click outside

Question

I have a Highslide plugin on my webpage with basic popups, what I need is that when a user clicks outside all the open popups should close.

Tried this but without luck:

   hs.close();

Answer 1

After doing some research in my console I came up with this solution and is working pretty fine..

$(document).mouseup(function (e)
{
    if($(".highslide-wrapper").length==0)
        return;

    var container = $(".highslide-wrapper");

    if (!container.is(e.target) 
        && container.has(e.target).length === 0) 
    {
        for (var i = 0; i < hs.expanders.length; i++) {
            var exp = hs.expanders[i];
            if (exp) exp.close();
        }
    }
});

And you can also have a check if the clicked element is another thumbnail or not..

Answer 2

This might help: http://forum.highcharts.com/highslide-js-usage/multiple-hs-close-t22148/

But if you're not using a dimming background, clicking outside of an expander won't close it. How could it? You might be clicking on another thumbnail to open it - it can't tell the difference.

Answer 3

hs.Expander.prototype.onInit = function(sender) {
    for (var i = 0; i < hs.expanders.length; i++) {
        var exp = hs.expanders[i];
        if (exp) exp.close();
    }
};