您的浏览器不支持HTML5视频或者没有安装Flash插件! 为什么呢? | 您所在的位置:网站首页 › 支持播放swf的播放器 › 您的浏览器不支持HTML5视频或者没有安装Flash插件! 为什么呢? |
因为要播放视频需要播放器插件的支持,HTML5中有自带播放器---video标签。
Flash插件就是一个播放器插件,条件满足一条就可以播放视频了。您可以试试下载一个Flash插件或是换一个支持HTM5浏览器的浏览器,比如、谷歌、火狐等一些主流浏览器!DOCTYPE html
html lang="zh-cn"
head
meta charset="UTF-8"
meta name="viewport" content="width=device-width, initial-scale=1.0"
meta http-equiv="X-UA-Compatible" content="ie=edge"
titlevlc-video视频播放/title
link rel="stylesheet" href="./css/common.css"
link rel="stylesheet" href="./js/layui/css/layui.css"
/head
body
!-- BTN --
div
button class="layui-btn" onclick="playVideo_1(),playVideo_2()"播放/button
button class="layui-btn" onclick="zanting_1(),zanting_2()"暂停/button
button class="layui-btn" onclick="kuaijin_1(),kuaijin_2()"快进10秒/button
button class="layui-btn" onclick="kuaitui_1(),kuaitui_2()"快退10秒/button
/div
!-- vlc播放器 --
div id="vlc-content_1" class="content"
embed id="vlcObj_1" src="123.mp4" type="application/x-vlc-plugin" pluginspage="http://www.videolan.org" width="100%" height="480" /
/div
!-- h5 video播放器 --
div id="video-contnt_1" style="display: none"
video id="video_1" src="123.mp4" controls width="100%" height="480"
您的浏览器版本太旧,请更新版本或使用其他浏览器
/video
/div
!-- BTN_1 --
div
button class="layui-btn" onclick="playVideo_1()"播放1/button
button class="layui-btn" onclick="zanting_1()"暂停1/button
button class="layui-btn" onclick="kuaijin_1()"快进10秒/button
button class="layui-btn" onclick="kuaitui_1()"快退10秒/button
/div
!-- vlc播放器 --
div id="vlc-content_2" class="content"
embed id="vlcObj_2" src="456.mp4" type="application/x-vlc-plugin" pluginspage="http://www.videolan.org" width="100%" height="480" /
/div
!-- h5 video播放器 --
div id="video-contnt_2" style="display: none"
video id="video_2" src="456.mp4" controls width="100%" height="480"
您的浏览器版本太旧,请更新版本或使用其他浏览器
/video
/div
!-- BTN_2 --
div
button class="layui-btn" onclick="playVideo_2()"播放2/button
button class="layui-btn" onclick="zanting_2()"暂停2/button
button class="layui-btn" onclick="kuaijin_2()"快进10秒/button
button class="layui-btn" onclick="kuaitui_2()"快退10秒/button
/div
!-- 播放器公共部分--
div
select id="beisu"
option value="0.5"0.5x/option
option value="1" selected1.0x/option
option value="1.25"1.25x/option
option value="1.5"1.5x/option
option value="2"2.0x/option
/select
script src="./js/jquery-1.8.0.min.js"/script
script src="./js/layui/layui.js"/script
scriptvar VIDEO_1 = document.getElementById("video_1")/script
scriptvar VIDEO_2 = document.getElementById("video_2")/script
scriptvar VLC_1 = document.getElementById("vlcObj_1")/script
scriptvar VLC_2 = document.getElementById("vlcObj_2")/script
/div
script
var layer = ''
var useVlc = getBrowserInfo().indexOf('IE') != -1
layui.use('layer', function () {
layer = layui.layer
(function () {
if (useVlc) { // IE浏览器使用vlc
try {
$("#vlc-content_1").show()
$("#vlc-content_2").show()
} catch (err) {
$("#vlc-content_1").hide()
$("#vlc-content_2").hide()
if (getPlatform() == 'win32') {
layer.confirm('当前浏览器暂未安装视频播放插件,点击确定安装', {
btn: ['确定', '取消']
}, function () {
window.open('http://47.96.19.54:8080/vlc/vlc-2.2.4-win32.exe')
})
} else if (platform == 'win64') {
layer.confirm('当前浏览器暂未安装视频播放插件,点击确定安装', {
btn: ['确定', '取消']
}, function () {
window.open('http://47.96.19.54:8080/vlc/vlc-2.2.4-win64.exe')
})
}
}
} else { // 其他浏览器使用html5-video
$("#vlc-content_1").hide()
$("#video-contnt_1").show()
$("#vlc-content_2").hide()
$("#video-contnt_2").show()
}
// 绑定倍速
$("#beisu").on("change", function () {
var v = $(this).val()
if (useVlc) {
VLC.input.rate = v
} else {
VIDEO.playbackRate = v
}
})
})()
})
// 播放_1
function playVideo_1(url) {
if (useVlc) {
url ? VLC_1.playlist.add(url) : ""
VLC_1.playlist.play()
} else {
url ? VIDEO_1.src = url : ""
VIDEO_1.networkState != 3 ? VIDEO_1.play() : ""
}
}
// 播放_2
function playVideo_2(url) {
if (useVlc) {
url ? VLC_2.playlist.add(url) : ""
VLC_2.playlist.play()
} else {
url ? VIDEO_2.src = url : ""
VIDEO_1.networkState != 3 ? VIDEO_2.play() : ""
}
}
// 暂停播放_1
function zanting_1() {
if (useVlc) {
VLC_1.playlist.pause()
} else {
VIDEO_1.pause()
}
}
// 暂停播放_2
function zanting_2() {
if (useVlc) {
VLC_2.playlist.pause()
} else {
VIDEO_2.pause()
}
}
// 快进10秒播放_1
function kuaijin_1() {
if (useVlc) {
VLC_1.input.time += 10000
} else {
VIDEO_1.currentTime += 10
}
}
// 快进10秒播放_2
function kuaijin_2() {
if (useVlc) {
VLC_2.input.time += 10000
} else {
VIDEO_2.currentTime += 10
}
}
// 快退10秒播放_1
function kuaitui_1() {
if (useVlc) {
VLC_1.input.time -= 10000
} else {
VIDEO_1.currentTime -= 10
}
}
// 快退10秒播放_2
function kuaitui_2() {
if (useVlc) {
VLC_2.input.time -= 10000
} else {
VIDEO_2.currentTime -= 10
}
}
//适用于IE6/7/8/9/10/11浏览器,并且安装有vlc插件,则返回true;
function isInsalledIEVLC() {
var vlcObj = null
var vlcInstalled = false
try {
vlcObj = new ActiveXObject("VideoLAN.Vlcplugin.2")
if (vlcObj != null) {
vlcInstalled = true
}
} catch (e) {
vlcInstalled = false
}
return vlcInstalled
}
// 获取浏览器类型
function getBrowserInfo() {
var userAgent = navigator.userAgent//取得浏览器的userAgent字符串
var isOpera = userAgent.indexOf("Opera") -1//判断是否Opera浏览器
var isIE = window.ActiveXObject || "ActiveXObject" in window
var isEdge = userAgent.indexOf("Edge") -1//判断是否IE的Edge浏览器
var isFF = userAgent.indexOf("Firefox") -1//判断是否Firefox浏览器
var is360 = userAgent.indexOf("360SE") -1//判断是否360浏览器
var isSafari = userAgent.indexOf("Safari") -1 userAgent.indexOf("Chrome") == -1//判断是否Safari浏览器
var isChrome = userAgent.indexOf("Chrome") -1 userAgent.indexOf("Safari") -1 !isEdge//判断Chrome浏览器
if (isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+)")
reIE.test(userAgent)
var fIEVersion = parseFloat(RegExp["$1"])
if (userAgent.indexOf('MSIE 6.0') != -1) {
return "IE6"
} else if (fIEVersion == 7) {
return "IE7"
} else if (fIEVersion == 8) {
return "IE8"
} else if (fIEVersion == 9) {
return "IE9"
} else if (fIEVersion == 10) {
return "IE10"
} else if (userAgent.toLowerCase().match(/rv:([\d.]+)\) like gecko/)) {
return "IE11"
} else {
return "0"
} //IE版本过低
} //isIE end
if (isFF) {
return "FF"
}
if (isOpera) {
return "Opera"
}
if (isSafari) {
return "Safari"
}
if (isChrome) {
return "Chrome"
}
if (isEdge) {
return "Edge"
}
if (is360) {
return "360SE"
}
}
// 获取浏览器32位还是64位,安装对应的vlc
function getPlatform() {
var agent = navigator.platform.toLowerCase()
if (agent.indexOf("win64") = 0 || agent.indexOf("wow64") = 0) {
return "win64"
} else if (agent.indexOf("win32") = 0 || agent.indexOf("wow32") = 0) {
return "win32"
}
}
/script
/body
/html 直接用video标签不是不行,但是相对来讲缺少很多功能,而且兼容性不好,旧版浏览器无法识别该标签,故无法在旧版浏览器中播放视频。即便不考虑旧版浏览器,能够使用video标签的现代浏览器之间也存在编码格式不兼容的问题,而需要在服务器上为同一个视频文件分别存储格式。市面上大部分视频插件都是以FLASH形式存在的,FLASH在所有浏览器上都能运行,因而不存在任何兼容问题,多年的技术沉淀也使得FLASH播放器技术越加成熟功能扩展越来越强大,所以一般都通过FLASH视频插件播放。不过我相信随着标准的制定越加完善VIDEO标签在将来一定会代替FLASH播放器。 欢迎分享,转载请注明来源:内存溢出 原文地址:https://outofmemory.cn/zaji/7275026.html |
CopyRight 2018-2019 实验室设备网 版权所有 |