Or more specifically - how (or actually - can you) detect if the current window has focus (i.e. it is the active window) when the window just opens?
I know I can listen for window.onblur and window.onfocus, but I'm trying to figure out how to address users that "open link in background tab/window" and the code starts running without either the onblur or onfocus events being called.
Unfortunately, You cannot detect if window has focus in Javascript. You can only notice when it get or lost focus using onfocus and onblur, as You said.
Some Flash video players start playing when the window receives focus. So, it seems that there is at least a way to do this in Flash (I'm no expert!). If there's no pure JavaScript way of achieving this (I can't think of any hacks at the moment), you could embed an invisible Flash applet that notifies your JavaScript code when the window receives focus.
Related
This is not to detect whether an element's style is set to visible or physically visible in an active, focused tab. I'd like to know if it's possible to detect whether an element is obscured by another windows using Javascript. If there's no method to call or property to check, would it be possible to use the Javascript repaint event to detect whether the window or a portion of it is obscured?
EDIT: I should say that I'm looking to replace existing functionality where we were able to do this by embedding a flash pixel into the page and calling a function in its paint method. Chrome is preventing this going forward because it apparently causes jank in mobile browsers.
I'm writing a turn-based game in which the server may send messages to the javascript client at random times. When the client receives these messages, it puts an asterisk at the document's title. My problem is, how do I detect that the user is viewing the page, so that I can remove the asterisk as soon as the user has seen the new messages?
For instance, how does Gmail and Facebook do it? I heard that one cannot put an onfocus property on the body object.
I would also like to know why the body doens't have the onfocus property.
You can check document.hidden, or use document.visibilityState for more options.
Support is pretty good.
Why not listen for the focus and blur events on window?
window.addEventListener('focus', onFocus); // window has focus
window.addEventListener('blur', onBlur); // window lost focus
Is there any DOM event for when the browser tab loses/gains focus? I know there are the blur and focus events on window, but they also fire when the browser window as a whole loses focus. The browser might then be still visible to the user. Of course such an event would be browser specific, but that's ok.
The reason why I want this is because I run animations that might consume quite some CPU time. When the browser tab is not visible there is no reason to continue animating. Now I know that modern browsers reduce the timer resolution of background tabs, but I could actually pause the animation, so that no CPU time whatsoever is consumed.
In case you are wondering, this is what I'm writing:
http://panzi.github.com/Browser-Ponies/
At least Google Chrome supports a webkitvisibilitychange event and a document.webkitHidden property. See the visibility API. But it seems only to fire when the shown tab changes, not when the whole window is minimized. There also seems to be a visibilitychange event for Internet Explorer, but the documentation doesn't say anything about it.
The closest thing I believe you'll find is the top answer here:
Is there a way track the focus on tab with Javascript?
Now they have exactly what was needed:
https://developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API
I'm currently coding counter system and have spotted one problem with flash banners without wmode attribute at all, loaded via iframe from another website.
Works only mouseout event.
The problem is, that i can't catch click event on those banners.
Is there any solution?
Thanks.
No, Flash and other plugins deal with mouse interaction on their own and cannot be interfered with from HTML. Even if you changed the wmode and layered other HTML elements on top of the Flash, having caught a click on an element you could not then route that click into Flash either.
So you can't catch a click on Flash unless the Flash is deliberately written co-operatively to pass information about clicks out to JavaScript (eg. by providing a listener interface). There is no way to reliably audit third-party Flash banner clicks.
About all you can do would be to listen for mouseover/mouseout on a block containing the Flash, and if the current window loses focus in between the mouse entering and leaving, make a guess that the user clicked the banner and popped up a new window. This is still massively unreliable (plenty of scope of false +ves and false -ves).
no wmode or wmode=window means that the Flash file is rendered on top of the page not inside it. So you practically have no means to do anything with this file without the correct wmode (opaque or transparent)
I have a div that toggles in and out of display when you click on another div. How could I modify my code so that when the user minimizes the whole browser window it automatically toggles, hiding the div from view so when the user un-minimizes window the div is no longer visible.
Minimizing the window (or switching to another application) should fire the window.onblur event. Activating the window should fire window.onfocus
Implementation details may differ slightly between browsers but there seems to be no better way in default javascript (may be you can use some flash object if flash can detect minimizing/maximizing of the window to fire necessary events, but I'm not familiar with flash)
From a quick search it looks like you can attach an event to the windows resize event, then call the required toggle functions from there as usual. I havnt actually tested the linked sample though...
$(window).bind('resize', function() { ....
http://snipplr.com/view/6284/jquery--window-on-resize-event/
In JavaScript, there is no way to detect when a window is minimized.
You could try detecting a resize or blur event on the window, however those can be triggered by things other than a minimize.