<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<!-- 引入基礎(chǔ)樣式文件 mui-player.min.css -->
<style>
.container1{
max-width: 960px;
/*height: auto;*/
height: 600px;
margin: 50px auto;
text-align: center;
color: rgb(29, 121, 216)
}
#dplayer {
/* */
max-width: 960px;
height: 620px;
margin: 0 auto;
}
a{
text-decoration: none;
color: rgb(29, 121, 216);
}
.container2 {
/*display: flex;*/
max-width: 960px;
/*height: auto;*/
height: 600px;
text-align: center;
margin: 0 auto;
/**/
}
#mse {
/* */
width: 600px;
height: 337px;
}
.container2 h2{
color: rgb(29, 121, 216)
}
.breadcrumb{
background-color: rgb(29, 121, 216);
}
.mse {
padding-right: 0;
padding-left: 0;
}
</style>
</head>
<body>
<!-- 指定播放器容器 -->
<div class="container">
<a href="/index"><div id="index"><h1>首頁(yè)</h1></div></a>
<div id="dplayer"></div>
<div id="title"><h2>標(biāo)題</h2></div>
</div>
<!-- dplayer測(cè)試demo -->
<!-- 引入基礎(chǔ)腳本 player.min.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/hls.js/1.5.18/hls.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dplayer/1.27.1/DPlayer.min.js"></script>
<script >
const dp = new DPlayer({
container: document.getElementById('dplayer'),
video: {
// url: 'http://videomy.yongaomy.com:8091/20200502/dAPPeXWg/index.m3u8',
url: 'https://lizst.glendonclass.com/media/videos/mp4/235858.mp4?st=jn6DoWyxoKMLsoI8gyyq8Q&e=1738424843',
//url: 'https://v.zuisevod.com/20241209/2V66l0yF/index.m3u8',
//pic: '',
type: 'auto',
},
autoplay: true,
});
</script>
<!-- <script src=" url_for('static', filename='js/playpage.js') "></script> -->
</body>
</html>
浙公網(wǎng)安備 33010602011771號(hào)