Easy iFrame Loader Plugin For jQuery - iFrame.js
File Size: | 29.5 KB |
---|---|
Views Total: | 1700 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

iFrame.js is an easy jQuery ifame loader plugin that enables you to handle and manage iframe based html contents on the webpage.
More features:
- Notifies your event handler when iframe has finished loading.
- Your event handler receives loading duration (as well as iframe).
- Optionally calls your timeout handler.
How to use it:
1. Load the main JavaScript file jquery.iframe.js
in your html page.
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"> </script> <script src="js/jquery.iframe.js"></script>
2. The plugin provides you a callback so you know when the frame has been loaded, tells you how long it took to load, and provides timeout support.
$("iframe").src(url, optionalCallback, options);
3. Squirt your own content into your iframes. Due to cross-domain restrictions, "squirt" can only be used with an iframe whose source is either null or pointing to the same domain as the parent document.
$("iframe").squirt("a <em>little</em> content");
4. Possible plugin options:
- timeout: will be called some time (according to timeoutDuration) after the iframe started loading, if the iframe hasn't yet finished loading. Use "this" to access iFrame. (Note: If you want to abort loading on timeout, you should do it manually in this function, e.g. "this.src=null".)
- timeoutDuration: Timeout duration, used in conjunction with options.timeout. (Defaults to 60000, i.e. one minute.)
$("iframe").src("https://google.com", function(iframe, duration) { alert("That took " + duration + " millis."); }, { timeout: function() { alert("oops! timed out."); }, timeoutDuration: 10000 });
This awesome jQuery plugin is developed by mahemoff. For more Advanced Usages, please check the demo page or visit the official website.