jQuery Plugin For Auto Resizing iFrame - iframe Auto Height
File Size: | 292 KB |
---|---|
Views Total: | 59338 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

iframe Auto Height is a simple jQuery plugin to dynamically resize iframes based on content height. It helps you to create neat content iFrames to fit your Web typography. More examples are available in the Demo fold, check out them to see how this plugin works.
See also:
Basic Usage:
1. Include jQuery library and jQuery iframe Auto Height on the web page
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="jquery.iframe-auto-height.plugin.js"></script>
2. Include jQuery Browser Plugin after jQuery library if you are using jQuery 1.9.0 and up
<script type="text/javascript" src="jquery.browser.js"></script>
3. Create a iFrame
<iframe src="photo.html" class="photo" scrolling="no" frameborder="0"></iframe>
4. Call the plugin and then done
<script> $('iframe.photo').iframeAutoHeight({ minHeight: 240, // Sets the iframe height to this value if the calculated value is less heightOffset: 50 // Optionally add some buffer to the bottom }); </script>
5. set default option values
// add some buffer to the bottom heightOffset: 0, // set the iframe height to this value if the calculated value is less minHeight: 0, maxHeight: 0, // do something with the callbackObject.newFrameHeight value callback: function () {}, // use jquery animate with duration of 500 when resizing the iframe animate: false, // hard set the iframe height to the minHeight before re-sizing resetToMinHeight: false, // optionally define 1 or more functions that will have access to the resize method // can be used to resize the iframe from external events such as click or window resize - see examples below triggerFunctions: [], // optionally re-define the height calculation method(s) // override the default implementation or just override specific browsers heightCalculationOverrides: []
Change logs:
v2.0.0 (2015-06-29)
- Add chrome to strategyKeys array
- use window.parent instead of window.top.document
2014-05-18
- update
This awesome jQuery plugin is developed by house9. For more Advanced Usages, please check the demo page or visit the official website.