温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

iframe自适应高度的插件

发布时间:2020-06-09 17:18:18 阅读:1304 作者:magicsa 栏目:web开发
开发者测试专用服务器限时活动,0元免费领,库存有限,领完即止! 点击查看>>

项目地址: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 src="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 keyword

    • for 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

上传了压缩包

附件:http://down.51cto.com/data/2363378

亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI

开发者交流群×