项目地址:https://github.com/house9/jquery-iframe-auto-height
跨域无效!
用法:
jQuery('iframe').iframeAutoHeight(); 设置所有的iframe
$('iframe.photo').iframeAutoHeight();指定的iframe
<!-- with document ready, most likely in the html head --><script> $(document).ready(function () { $('iframe').iframeAutoHeight({debug: true}); });</script><!-- inline, after the iframe --><iframe class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="my_iframe.html" class="auto-height" scrolling="no" frameborder="0"></iframe><script> $('iframe.auto-height').iframeAutoHeight({minHeight: 240});</script>
选项:
callback: function
Default empty function
Optionally define a callback function (in this case inline) that will do something with the callbackObject.newFrameHeight value. This can for instance be used with easyXDM to alert another domain that the frame has changed height.
Example:
$('iframe').iframeAutoHeight({callback: function(callbackObject) { alert(callbackObject.newFrameHeight);} });
you can also access the current iframe jquery wrapper object use the
this
keywordfor example:
callback: function(callbackObject) { alert(callbackObject.newFrameHeight + " and the iframe href is:" + $(this).attr('src')); }
debug: boolean
Default is false
Will log some internal information to the console, if available
Example:
$('iframe').iframeAutoHeight({debug: true})
heightOffset: integer
Default is 0
Unit is pixels
Optionally add some buffer to the bottom
Example:
$('iframe').iframeAutoHeight({heightOffset: 20});
minHeight: integer
Default is 0
Unit is pixels
Sets the iframe height to this value if the calculated value is less
Example:
$('iframe').iframeAutoHeight({minHeight: 200});
animate: boolean
Default is false
Uses jquery animate with duration of 500 when resizing the iframe
Example:
$('iframe').iframeAutoHeight({animate: true});
resetToMinHeight: boolean
Default is false
hard set the iframe height to the minHeight before re-sizing
triggerFunctions: Array of functions
Default is an empty array
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
heightCalculationOverrides: Array of 2 element arrays
Default is an empty array
Optionally re-define the height calculation method(s)
override the default implementation or just override specific browsers
Example:
$('iframe').iframeAutoHeight({strategyOverrides: [{ browser: 'mozilla', calculation: function () { return 2000; }}]);
The
browser
key should be one of 'webkit', 'mozilla', 'msie', 'opera' or 'default', seehttp://api.jquery.com/jQuery.browser/The
calculation
key should be a function, usually with the signature(iframe, $iframeBody, options, browser)
see more examples below
上传了压缩包
共同学习,写下你的评论
评论加载中...
作者其他优质文章