如何輸出寬度=“ 100％”或寬度=“”的iframe。 不，寬度=“ 100”

Question

我正在使用vimeowrap循環播放視頻的播放列表。 我希望vimeowrap輸出的iframe的寬度和高度不為“ 100％”或“”。 兩者都會起作用。

Vimeo包裝： http ： //luwes.co/labs/vimeo-wrap/

我的測試頁： http : //www.a3network.com/vimeo_wrap.html

這是我正在測試的。

<script>
    vimeowrap('player').setup({        
        urls: [
            'https://vimeo.com/16437160',
            'https://vimeo.com/16439781',
            'https://vimeo.com/16449483',
            'https://vimeo.com/16449643',
            'https://vimeo.com/16449980',
            'https://vimeo.com/16450347'
        ],
        width: '100%',
        height: '100%'
    });
</script>

我得到以下輸出：

<iframe width="100" height="100" frameborder="0" allowfullscreen="" mozallowfullscreen="" webkitallowfullscreen="" src="http://player.vimeo.com/video/16437160?api=1&amp;player_id=player_0" id="player_0" style="position: absolute; display: block;"></iframe>

我需要以下輸出：

<iframe width="100%" height="100%" frameborder="0" allowfullscreen="" mozallowfullscreen="" webkitallowfullscreen="" src="http://player.vimeo.com/video/16437160?api=1&amp;player_id=player_0" id="player_0" style="position: absolute; display: block;"></iframe>

任何幫助，建議，線索，線索，提示都非常受歡迎，也非常感謝。

Answer 1

似乎vimeowrap不支持設置百分比高度/寬度。 添加后，您可以簡單地更改框架上的樣式，例如（使用JQuery）：

vimeowrap('player').setup({        
    urls: [
        'https://vimeo.com/16437160',
        ...
    ]
});
$("#player").find(":iframe").css("width", "100%").css("height", "100%");

您也可以看看我用來嘗試的小提琴 。

Answer 2

您可以將處理程序添加到playlist和playerReady事件中，然后將div和iframe的大小調整為100％：

var player = vimeowrap('player').setup({
   ...
});

player.events.playlist.add(function() {
    player.container.style.height = '100%';
    player.container.style.width  = '100%';
    player.display.style.width    = '100%';
    player.display.style.height   = '100%';
});

player.events.playerReady.add(function() {
    player.iframe.width  = '100%';
    player.iframe.height = '100%';
});

演示： http ： //jsfiddle.net/C5UTC/