video.js - controls not displaying in IE8

孤人 提交于 2019-12-21 17:29:33

问题


I'm implementing videojs and have it working in all browsers however the controls are not visible and the play button is broken in IE8 with Flash fallback.

Following some digging, I've ensured that I'm using the latest versions of js and css by linking to the cdn.

Saw a reference to "boxWidth = box.offsetWidth" but I believe this was corrected since v3.2.

The code is as follows and served up via an iframe in colorbox.js

    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <link href="http://vjs.zencdn.net/4.0/video-js.css" rel="stylesheet">
    <script src="http://vjs.zencdn.net/4.0/video.js"></script>

</head>
<body>

    <?php if (!empty($this->user) && $this->access === true) { ?>        
        <div id="player" class="" style="">
            <video id="video-player" class="video-js vjs-default-skin" controls autoplay width="640" height="480" datasetup="{}">
                <source src="[VIDEOURL].mp4" type="video/mp4" />
                <source src="[VIDEOURL].ogg" type="video/ogg" />    
            </video>
        </div>
    <?php } ?>

    <script>

        var player = videojs("video-player");
        _V_.options.flash.swf = "[FLASHURL].swf";

    </script>           
</body>


回答1:


For anyone having the same problem after trying the solutions in this thread, I just went through the same thing and found a fix (for the problem I was having, at least).

VideoJS uses a font called VideoJS to represent the control icons. To display the icons, it uses the font with the CSS3 :before selector, which does not work in IE8 if in IE7 Standards mode.

Even though you may be using IE8, it's possible the document mode has been set to IE7, Open up the developer tools, and make sure that you aren't on IE7 mode:




回答2:


Not sure if you looked at the video-js.css file, but I hade the exact same problem.

When I inspected video-js.css, I noticed that the @font-face values for the default skin were pointing to the wrong URL's.

Once I updated these settings to the correct values for where I had installed the font folder (part of the video-js download package), everything worked correctly.




回答3:


data-setup='{ "controls": true, "autoplay": true, "preload": "auto" }'

Try this and remove controls autoplay from your code



来源:https://stackoverflow.com/questions/16741987/video-js-controls-not-displaying-in-ie8

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!