disable closing popup when clicking on background

2.9k views Asked by At

I use featherlight.js for lightbox. When it is opened and I click on it's background it cloeses popup. I need to disable this functionality. I noticed that this js has closeTrigger option in it but don't know how to use it.

4

There are 4 answers

0
Nikhil Batra On BEST ANSWER

There is a default option in it:

 closeOnClick: false           /* Close lightbox on click ('background', 'anywhere', or false) */

Select "FALSE" value this will disable the closing of popup on clicking on background.

0
Özgür Ersil On

In documentation, you can disable it from its defaults

defaults: {
      closeOnClick: false, /* Close lightbox on click ('background', 'anywhere', or false) */
}
0
aiddev On

thanks, I found solution after writing my question, but thanks everyone. My final code looks in this way:

jQuery.featherlight(jQuery('#professional_investor_box'), {
        closeOnClick:false,
});
1
Lokesh Yadav On

I would suggest not to write javascript snippet separately as you already using "data" attributes to initialise the lightbox.

As per documentation provided, you can set data-featherlight-close-on-click="false" in markup itself to achieve the same.

Fiddle - http://jsfiddle.net/ylokesh/c5pq5bs1/2/

HTML

<a class="btn btn-default" href="#" data-featherlight-close-on-click="false" data-featherlight="#fl1">Default</a>
<div class="lightbox" id="fl1">
    <h2>Featherlight Default</h2>
    <p>
        This is a default featherlight lightbox.<br>
        It's flexible in height and width.<br>
        Everything that is used to display and style the box can be found in the 
    </p>
    <a href="https://github.com/noelboss/featherlight/blob/master/src/featherlight.css">featherlight.css</a> file which is pretty simple.
</div> 

With this option, you will save writing separate script block just to enable this feature.