Posted on 1 Comment

Today’s Technical Challenge

This one sounds pretty simple. I bet you can’t do it! (That is coming from the guy who claims anything can be done…I will find a way!).

The challenge: Part 1- Write a piece of JavaScript that pops an alert box with the message "You left!" when focus is lost on the browser. This means that if someone is looking at the webpage in Firefox and then switches to another webpage in a different tab, different window, or goes to a different application altogether (say Microsoft Word or Internet Explorer), then the alert box should appear. Any loss of focus to the active webpage makes the alert popup.

The challenge: Part 2- Write a piece of JavaScript that pops an alert box with the message "You returned!" when focus is returned to the browser. This means if someone was checking their email, using Internet Explorer, or was in a different Firefox tab, when they return to your webpage the alert box pops up.

The JavaScript for this challenge should work in both Firefox and Internet Explorer. The user should be able to repeatedly remove focus and return to focus and see both messages multiple times.

Good luck!

References

  • Mozilla.org reference to window.onblur Using their code example works differently in Firefox and Internet Explorer. In Firefox, the event fires twice meaning when I move away from the window, I get two alert boxes. In Internet Explorer the event fires once. Returning focus to the window and leaving against does not cause a blur event. So this appears to work once per loading of the window and not through repeated lost focus and refocuses.
  • Incorrect behavior of window.onblur event under IE and a workaround I need to test this in IE7

1 thought on “Today’s Technical Challenge

  1. Did anyone ever solve this?

    I can only surmise that Google chat accomplishes this using iframes. Perhaps the onfocus/onblur events behave in a more predictable/consistent fashion?

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.