如何在启动时全屏运行?

时间:2014-07-07 08:43:33

标签: javascript wimpy

http://www.wimpyplayer.com/

正在搜索文档,但没有找到如何全屏运行。有人可能知道吗?

该播放器的新版皮肤机器在哪里?当我进入谷歌时,我只找到了一些用于Rave的old,我认为它适用于旧版本的播放器。但我看到一个新版本的在线编辑器,我无法找到。

然后我会删除按钮面板,并使用setSize()功能设置播放器的大小。

从浏览器历史记录中找到皮肤机器。即使我使用完全关键字http://www.wimpyplayer.com/skinmachine/

,Google也找不到它

1 个答案:

答案 0 :(得分:0)

在下载ZIP中有一个名为" test"的文件夹。其中包括此文件:

"选项响应 - 大小 - fullscreen.html"

...您可以将其用作参考。

诀窍是使用"数据响应"让wimpy扩展到CSS中定义的页面大小的选项。

这是一个清理版本,需要以全屏模式运行HTML:

<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Wimpy Player - Fullscreen</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">


<!-- The following META tags are used to inform mobile-device browsers to present this page in full-screen mode.-->
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0, minimal-ui" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="Wimpy Player" />


<style type="text/css" media="screen">
    /* Make page fill device window */
    html, body {
        width : 100%;
        height : 100%;
        margin:0;
        padding:0;
        overflow:hidden;
        background-color:#484848;
    }
    /* For the Player Instance DIV */
    .full {
        left:0px;
        top:0px;
        width : 100%;
        height : 100%;
    }
</style>


<!-- Prevent entire page from "bouncing" -->
<script>document.addEventListener('touchmove',function(event){event.preventDefault();},false);</script>


<!-- Wimpy Engine -->
<!-- NOTE: Change WIMPY_INSTALLATION_FOLDER to target the wimpy.js file correctly. -->
<script src="WIMPY_INSTALLATION_FOLDER/wimpy.js"></script>



</head>
<body>

<!-- Set the DIV's class to "full" and set the "responsive" option 
so the player automatically adjusts to fit snuggly within the view. 
The responsive option also causes the player to adjust itself when 
the orientation changes (e.g. from landscape to portrate) -->

<!-- NOTE: Change data-media to target media files or a playlist. -->
<div class="full" data-wimpyPlayer data-responsive data-media="song1.mp3|song2.mp3|song3.mp3"></div>


</body>
</html>

更新: This page on wimpyplayer.com也解释了这一点。