安卓4.4 - webview不接受css宽度100%

vhmi4jdf  于 2023-02-14  发布在  其他
关注(0)|答案(2)|浏览(143)

我对android 4.4+的webview的新实现有一个问题。
我的HTML代码:

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="http://s.videos.globo.com/p2/j/api.min.js" type="text/javascript"></script>
    <style type="text/css" media="all">
        #player-wrapper, #image-wrapper {
            width: 100% !important;
            height: 100% !important;
            position: absolute;
            left: 0;
            top: 0;
            z-index: 1;
        }
        #image-wrapper {
            z-index: 999;
            background-color: white;
        }
    </style>
</head>
<body>
    <div id="player-wrapper"></div>
    <img id="image-wrapper">

    <script type="text/javascript">
        var element = document.getElementById('player-wrapper');
        var image = document.getElementById('image-wrapper');

        var player = new WM.Player({
                        autoPlay: true,
                        width: 640,
                        height: 360
                    });

        player.attachTo(element);

        image.onclick = function() {
            player.playVideo();
            image.style.visibility = 'hidden';
        };
    </script>
</body>

但是规则宽度:100%不起作用,#播放器 Package 器比网页视图大。奇怪的是只有#播放器受到影响,#图像是正确的。
有人能帮我吗?

2mbi3lxu

2mbi3lxu1#

问题出在WM.player构造函数上,它将播放器的宽度设置为640 px,这可能比你的viewport要大。在WM.Player构造函数中没有max-width参数,所以你必须使用一个 meta标记。尝试在HTML的head部分添加<meta name="viewport" content="width=640px">,这样viewport的大小就可以适应WM.Player构造函数中设置的640 px宽度。

okxuctiv

okxuctiv2#

这个html标记可能会有用。

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

相关问题