如何为jPlayer设置宽度和高度答案

【问题标题】：How to set width and height to jPlayer如何为jPlayer设置宽度和高度
【发布时间】：2012-02-12 12:35:31
【问题描述】：

我正在使用 jPlayer 库，但我不知道如何设置宽度和高度

我的代码是：

 $("#jquery_jplayer_1").jPlayer({
                    ready: function(){
                        $(this).jPlayer("setMedia", {
                            m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v"
                        }).jPlayer("play");
                    },
                    ended: function(event){
                        // $(this).jPlayer("play");
                    },
                    swfPath: "../../common/assets/jplayer/js",
                    supplied: "m4v"

                });

请帮帮我。

【问题讨论】：

你在哪里处理这个问题？

标签： javascript jquery html flash jplayer

【解决方案1】：

未经测试，我认为您的代码应如下所示：

 $("#jquery_jplayer_1").jPlayer({
                    ready: function(){
                        $(this).jPlayer("setMedia", {
                            m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v"
                        }).jPlayer("play");
                    },
                    ended: function(){
                         $(this).jPlayer("play");
                    },
                    swfPath: "../../common/assets/jplayer/js",
                    supplied: "m4v",
                    size: {
                         width: "400px",
                         height: "30px"
                    }
                });

我注意到你试图循环文件？我更改了函数调用，因为您似乎不需要（事件）。

您应该阅读以下内容：http://jplayer.org/latest/developer-guide/#jPlayer-size
大小根据给定的文件类型而变化。

【讨论】：

【解决方案2】：

前面的答案中提到的width 和height 构造函数选项只会影响包含海报图像（如果是音频）或视频内容的#jquery_jplayer_1 元素本身的尺寸。

这些选项不会影响您的 GUI（其他一切 - 控件、播放列表等），其大小由 CSS 控制。

如果您正在使用其中一个演示 jPlayer 皮肤（例如“蓝色星期一”），您需要非常具体的 CSS 选择器来覆盖它们的规则，或者使用 !important 标志..

【讨论】：

【解决方案3】：

manual 说：

设置jPlayer的宽度和高度使用 jPlayer({size:Object}) 构造函数选项。

使用jPlayer({sizeFull:Object}) 设置全屏大小构造函数选项。

而

宽度
字符串：（默认：[视频：“480px”] [音频：“0px”]）

身高
字符串：（默认：[视频：“270px”] [音频：“0px”]）

这意味着类似

jPlayer({size:{width: "200px", height: "200px"}})

完成：

 $("#jquery_jplayer_1").jPlayer({
                    ready: function(){
                        $(this).jPlayer("setMedia", {
                            m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v"
                        }).jPlayer("play");
                    },
                    ended: function(event){
                        // $(this).jPlayer("play");
                    },
                    swfPath: "../../common/assets/jplayer/js",
                    supplied: "m4v",
                    size: {width: "200px", height: "200px"}
                });

【讨论】：