jQuery Plugin To Fire An Event When An iFrame Gets Focused - iframeActivationListener

File Size: 4.83 KB
Views Total: 1091
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Fire An Event When An iFrame Gets Focused - iframeActivationListener

A jQuery based iframe activation listener that allows to fire an "Activate" event when you click on an iFrame element.

Basic usage:

1. Embed an iFrame element (e.g. Youtube Player) into your html page.

<iframe src="https://www.youtube.com/embed/HPR3PB_VGVs" frameborder="0" allowfullscreen></iframe>

2. Include jQuery library and the jQuery iframeActivationListener.js at the bottom of the html page.

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="src/jquery.iframeActivationListener.js"></script>

3. Enable the activation listener on the iFrame element.

$('iframe').iframeActivationListener();

4. Fire an "Activate" event when the iFrame element gets focused. In this case, the plugin uses CSS to resize the iFrame element when clicked on.

$('iframe').on("activate", function(ev) {
  $(ev.target).addClass("resize");
});
iframe.big {
  width : 560px;
  height : 315px;
}

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