0

I'm trying to give the user a modal window when the leave the browser, and clicked on the taskbar or something.

The following code works in FF, Chrome, IE9, etc. But it does NOT work in IE8. What am I missing here?

        $(document).ready(function () {
            $(window).focus(function () {
                $("#dialog-message").dialog("close");
            })
                    .blur(function () {                           
                        var options = {};
                        $("#dialog-message").dialog({
                                modal: true,
                            position: 'center',
                            resizable: false,
                            closeOnEscape: true,
                            open: function (event, ui) {
                                $(".ui-dialog-titlebar-close", ui.dialog).hide();
                            },
                            show: "explode",
                            hide: "explode"
                        });
                    }).trigger('focus');


                });
PixelMuse
  • 470
  • 8
  • 24
  • Have you tried with `$("body")`? It might be the same effect but who knows. – VisioN May 16 '12 at 17:01
  • 1
    Haven't tried this before, and can't test IE8 myself, but try it on the `body` tag as @VisioN suggested, and give it a `tabindex` attribute. Sometimes IE needs that to handle focus/blur on non-form elements. – jmar777 May 16 '12 at 17:03
  • @ jmar777: sounds like something :) –  May 16 '12 at 17:04
  • Here http://stackoverflow.com/questions/1408699/ some suggest to place the event bindings inside `$(function() { ... })` (i.e. document ready) block. Possibly it helps. – VisioN May 16 '12 at 17:05
  • Tried $('body') that made it behave even worse. – PixelMuse May 16 '12 at 17:11
  • Hmm... for IE, try `$(document).on('focusin', ...)` and `$(document).on('focusout', ...)`. – jmar777 May 16 '12 at 17:26
  • @jmar777 You think bubbling makes sense? – VisioN May 16 '12 at 17:32
  • Not sure - just thrown some ideas out there lol. Seems like event delegation could work - maybe just look for any `blur` event that bubbles to the document, and then show a dialog if no `focus` events occur within ~50ms or so? – jmar777 May 16 '12 at 17:36
  • Here's a POC - can someone try it in IE8? http://jsfiddle.net/y2aXt/ – jmar777 May 16 '12 at 17:44
  • Hold on - fixed a bug causing blur condition to fire twice: http://jsfiddle.net/y2aXt/1/ – jmar777 May 16 '12 at 17:50

1 Answers1

1

It could be something simple like having white space before the .blur

Eruant
  • 1,816
  • 2
  • 14
  • 22