自适应视频播放器 [英] Responsive video player

问题描述

我需要一个视频播放器，用于通过使用引导程序开发的响应式布局网站.这意味着当我重新调整屏幕大小或在不同尺寸的屏幕上查看页面时，播放器应自动适应屏幕.

I need a video player for responsive layout website which is developed by using bootstrap. That means when i do re-size the screen or viewing the page in different size screens the player should be automatically fit to the screen.

我曾经尝试过使用jwplayer和flowplayer，但是没有用.

I had tried with jwplayer and flowplayer but it didn't work.

http ://www.longtailvideo.com/support/forums/jw-player/setup-issues-and-embedding/24635/response-video-internet-explorer-100-widthheight

注意:播放器应该可以播放youtube视频....

note: The player should be able to play the youtube videos....

是否有必要让jwplayer/flowplayer做出响应?

Is there anyway to make jwplayer/flowplayer responsive?

推荐答案

Luka回答的更好版本:

$(window).resize(function() {
    var $width = $("#holder").width();
    var $height = $width/1.5;
    jwplayer().resize($width,$height);
});

使用JW Player API中的调整大小功能:

User the resize function from the JW Player API:

http://www.longtailvideo.com/support/jw-player/29411/调整播放器大小

另一种解决方案:

查看其响应式设计支持文档: http://www .longtailvideo.com/support/jw-player/32427/sensitive-design-support

Check their Responsive Design Support documentation: http://www.longtailvideo.com/support/jw-player/32427/responsive-design-support

<div id="myElement"></div>
<script>
    jwplayer("myElement").setup({
        file: "/uploads/myVideo.mp4",
        image: "/uploads/myPoster.jpg",
        width: "100%",
        aspectratio: "12:5" // Set your image ratio here
    });
</script>

这篇关于自适应视频播放器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！