Read the Wiki for more information on iframe functionality and troubleshooting.
Functions across multiple windows, tabs AND IFRAMES within the same domain
Activity events detected, as configured by the idle-Timeout setup on this demonstration page, are CLICKS AND KEYPRESSES ONLY. To see the 'idle timeout' functionality, do not press any keys or click your mouse for 60 seconds.
Demonstrates the 'Bubbling' of Activity Events
From 'same domain' iframes to the parent page with both single and nested iframes.
From dynamic JQuery UI Dialogs with and without iframes, single and nested iframes, modal and non-modal dialogs.
From dynamic dom elements such as divs inserted into the body of the document.
From dynamic 'same domain', nested and unnested, iframes inserted into the body of the document. NOTE: Iframes inserted via javascript into the body of the document require special handling: manually call the 'iframe recheck' function. Add this snippet to the function which inserts the iframe: $.fn.idleTimeout().iframeRecheck();
Remember, activity within iframe content that does NOT have the same protocol, host and port (Same-Origin Policy) as the parent page CANNOT be detected. There are methods for 'relaxing' the Same-Origin Policy. Please see: http://en.wikipedia.org/wiki/Same-origin_policy
Basic Iframes Demonstrations
The idleTimeout plugin attaches an 'event listener' to 'same domain' iframes. The listener enables activity events within the iframe to 'bubble' to the parent page.
Activity within the single iframe on the left is detected because the 'child' page within the iframe is from the same domain as the parent page.
Activity within the nested iframes in the middle are detected because the 'child' pages within the iframes are from the same domain as the parent page.
Activity within the iframe on the right is NOT detected because the 'child' page within the iframe is from a different domain, weather.gov.
I shake when activity is detected.
New Dialog Demonstrations
This demonstration includes examples of both modal and non-modal dialogs, with and without iframes within the dialog, with both single and nested iframes.
The idleTimeout plugin 'listens' for the opening of dialogs and, if the dialog includes any iframes, an 'event listener' is added to each iframe.
Single Iframe Dialog - Non-Modal
Nested Iframe Dialog - Non-Modal
Form Dialog - Modal
This is a demonstration of a modal dialog form with no iframe.
New Inserted Iframes Demonstrations
Examples of dynamic iframes, single and nested, same domain and other domain.
Iframes that are dynamically added to the body of the page require an 'iframe recheck' function call. Please add this code to the function that inserts the iframe: $.fn.idleTimeout().iframeRecheck();. View the source of this page to see examples of the code in use.