New: Add option blurignore

cypress/integration/test.js

@@ -294,6 +294,21 @@ describe("jQuery Popup Overlay", () => {
       cy.get("#dynamic").should("be.visible");
     });
 
+    it("blurignore", () => {
+      cy.window().then(win => {
+        win.$("#dynamic").popup({ blurignore: 'h1', blur: true, autoopen: true });
+      });
+      // Clicking on the popup content should not hide it (this click is also required for a bug in Cypress with pointer-events:none)
+      cy.get("#dynamic").click(1, 1);
+      cy.get("#dynamic").should("be.visible");
+      // Clicking on h1 to test `blurignore`
+      cy.get("h1").click({ force: true });
+      cy.get("#dynamic").should("be.visible");
+      // Clicking outside of the popup
+      cy.get("#dynamic_wrapper").click(1, 1, { force: true }); // Cypress doesn't respect pointer-events:none; so we have to force the click
+      cy.get("#dynamic").should("be.hidden");
+    });
+
     it("setzindex true", () => {
       cy.window().then(win => {
         win.$("#dynamic").popup({ setzindex: true, autoopen: true });

index.html

@@ -307,6 +307,12 @@ <h2>Options</h2>
             <td>true</td>
             <td>Closes the popup if a user clicks anywhere outside the popup.</td>
         </tr>
+        <tr>
+            <td>blurignore</td>
+            <td>string <small class="text-muted"><i>(CSS&nbsp;selector)</i></small></td>
+            <td>true</td>
+            <td>Sets elements which will be ignored in <code>blur</code> option, even if they are outside.</td>
+        </tr>
         <tr>
             <td>closeelement</td>
             <td>string <small class="text-muted"><i>(CSS&nbsp;selector)</i></small></td>

jquery.popupoverlay.js

@@ -722,7 +722,12 @@
             }
 
             // If clicked outside of popup
-            if ($(el).data('popupoptions') && $(el).data('popupoptions').blur && !$(event.target).closest('#' + elementId).length && event.which !== 2 && $(event.target).is(':visible')) {
+            if ($(el).data('popupoptions')
+                && $(el).data('popupoptions').blur
+                && !$(event.target).closest($(el).data('popupoptions').blurignore).length
+                && !$(event.target).closest('#' + elementId).length
+                && event.which !== 2
+                && $(event.target).is(':visible')) {
 
                 if ($(el).data('popupoptions').background) {
                     // If clicked on popup cover
@@ -861,6 +866,7 @@
         offsetleft: 0,
         escape: true,
         blur: true,
+        blurignore: null,
         setzindex: true,
         autozindex: false,
         scrolllock: false,