SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: browser focus

  1. #1
    SitePoint Member
    Join Date
    Dec 2003
    Location
    In the upper level of my brain
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    browser focus

    Hi,

    What's a reliable way to tell when the browser window has either gained or lost focus?

    I've tried something like
    <frameset ... onFocus="..."> in the top level frameset, but it's intermittent at firing when the browser gets the focus back.

    Thanks.

  2. #2
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This has been asked many times - especially recently. It seems to me that there is no reliable way to determine if the window itself is focused/blurred, because the focus and blur events bubble up from all child elements and because there is insufficient info in the event object.

    The window.onfocus and window.onblur handlers will be called after any child element is focused or blurred. The handler's task is then to determine if the window is the actual 'target' of the event (too bad IE doesn't support 'eventPhase'). Below is something I used to experiment with this. This is only for IE.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <script type='text/javascript'>
    window.onload = function() {
      window.onblur = onBlurOrFocus;
      window.onfocus = onBlurOrFocus;
    }
    function onBlurOrFocus() {
      var i, s = '';
      for (i in event) {
        s += i + ': ' + event[i] + '\n';
      }
      s += '----------\n';
      document.getElementById('ta').value += s;
    }
    </script>
    </head>
    <body>
    
    <form>
    <input type='text' /><button>ok</button><br />
    <textarea id='ta' rows='20' cols='30'></textarea>
    <input type='reset' />
    </form>
    <p>Duis aute irure dolor in reprehenderit in voluptate
    velit esse cillum dolore eu fugiat nulla pariatur.</p>
    <p>Excepteur sint occaecat cupidatat non proident, sunt
    in culpa qui officia deserunt mollit anim id est laborum.</p>
    
    </body>
    </html>

  3. #3
    SitePoint Member
    Join Date
    Dec 2003
    Location
    In the upper level of my brain
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Mike.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •