javascript - 页面加载时推特框的 jQuery CSS 高度

标签 javascript jquery iframe

我知道这听起来有多愚蠢......

我正在尝试调整 iframe 的大小。这是我拥有的:

function doTwitterHeight(screenwidth)
{
    if(!screenwidth){
        var screenwidth = window.innerWidth;
        console.log('screenwidth is now defined as: ' + screenwidth);
    }
    if(screenwidth >= 981){
        $('#twitter-widget-0').css('height',466);
    }
    else if(screenwidth <= 980 && screenwidth >= 952){
        $('#twitter-widget-0').css('height',614);
    }
    else if(screenwidth <= 951 && screenwidth >= 877){
        $('#twitter-widget-0').css('height',632);
    }
    //etc.
    else{
        $('#twitter-widget-0').css('height',468);
    }
}

该函数在调用调整大小时起作用,如下所示:

$(window).on('resize', function(){
    doTwitterHeight();
});

但我还需要在首次加载页面时调用该函数并重新调整该 div 的高度。我试过:

 $(window).on('load', function() {      
    doTwitterHeight();
 });

和:

 $(document).ready(function(){
    doTwitterHeight();
 });

和:

$(doTwitterHeight());

我对他们中的任何一个都没有运气。

提前致谢:)

最佳答案

因此解决方案是修改 Twitter 为 iframe 嵌入提供的代码。通过使用在以下位置找到的建议:Twitter Embedded Timeline Callback

我现在已经通过替换解决了这个问题:

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

与:

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";js.setAttribute('onload', "twttr.events.bind('rendered',function(e) {doTwitterHeight()});");fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

即通过添加:

js.setAttribute('onload', "twttr.events.bind('rendered',function(e) {doTwitterHeight()});");

关于javascript - 页面加载时推特框的 jQuery CSS 高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23472973/

相关文章:

javascript - 在 JavaScript 中显示文本文件

javascript - 使用 modernizr.js/yepnope.js 加载 Google Maps API

html - 从 iframe 导入 css

javascript - 为什么将 %E2%80%8F 添加到我的 Youtube 嵌入代码中?

javascript - WordPress 中的内联 SVG 回退

javascript - VueJS : autoload component based on tag's prefix

javascript - 有没有办法只接受字母而不接受数字作为输入?如果给出数字,它应该显示验证错误,因为它只需要字母

javascript - 返回确认写入 "ok"

jQuery 卸载事件

javascript - Jquery - 在主页正文点击时隐藏 iframe 内容