jQuery Plugin To Load iFrame Content Asynchronously - EasyFrame

File Size: 10.6 KB
Views Total: 4007
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin To Load iFrame Content Asynchronously - EasyFrame

EasyFrame is a jQuery based iFrame enhancement plugin which loads iframe content (Youtube Videos, URLs, Widgets, etc) asynchronously on window load to improve page performance.

How to use it:

1. Include references to jQuery library and the jQuery EasyFrame plugin before the closing body tag.

<script src="//code.jquery.com/jquery-2.2.1.min.js"></script>
<script src="dist/jquery-easyframe.min.js"></script>

2. Initialize the plugin on document ready and we're ready to go.


3. Create an iframe element and specify the address of the document to embed in this iframe using data-src attribute instead of src

<iframe src="" data-src="http://jqueryscript.net" frameborder="0"></iframe>

4. You can also specify the document's address in the JavaScript during initialization.

  url: 'http://jqueryscript.net'

5. Specify the timeout which is used to wait after the window loads to instantiate the iframe async loading.

  timeout: 2000

6. All default options and callback.

  url: null,
  attribute: 'data-src',
  timeout: 0 
},function() {
  // do something

Change log:


  • Changed callback function at all iframe loaded

This awesome jQuery plugin is developed by EmanueleCoppola. For more Advanced Usages, please check the demo page or visit the official website.