頁面加載時twitter框的jQuery CSS高度

Question

我知道這聽起來多么愚蠢...

我正在嘗試調整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);
    }
}

調用resize時，該函數有效，如下所示：

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

但是我還需要調用該函數，並在首次加載頁面時重新調整該div的高度。 我試過了：

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

和：

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

和：

$(doTwitterHeight());

而且我與他們中的任何一個都沒有運氣。

提前致謝 ：）

Answer 1

因此解決方案是修改twitter為iframe嵌入提供的代碼。 通過使用以下建議： Twitter嵌入式時間軸回調

我現在通過替換來解決此問題：

<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()});");

Answer 2

您可以嘗試以下方法：

$(window).on('load resize', doTwitterHeight).resize(); // <---trigger it on load

或根據您的代碼段：

$(window).on('resize', function(){
    doTwitterHeight();
}).resize(); // <-----this triggers the resize on page load.