ss

src/page/secondPage.vue

@@ -8,7 +8,7 @@
 			<div class="left" :style="{width:index==2?'1860px':'1300px'}">
 				<div id="divPlugin" v-if="index==1"></div>
 				<video v-if="index==0" class="video" :src="video_src" width="1300" height="750" controls autoplay @ended="ended(sort)">不支持当前video标签</video>
-				<p class="video_name">{{video_name}}</p>
+				<p class="video_name" v-if="index==0">{{video_name}}</p>
 				<div v-if="index==2" class="videoList">
 					<div v-for="(item,index) in channelLists" :key="index" class="video_one" @click="item.play=!item.play">
 						<!--<div class="cover" v-show="!item.play">-->
@@ -21,7 +21,7 @@
 			<div class="right" v-if="index!=2">
 				<div v-if="index==0" style="width: 100%">
 					<div class="item" v-for="(item,index) in channelLists" :key="index" @click="switch_video(item,index)">
-						<video class="poster" :src="item.src" width="150" height="100" />
+						<img class="poster" :src="item.poster" width="150" height="100" />
 						<p class="poster_title">
 							<span class="title" :class="{selected:item.src==video_src}">{{item.title}}</span>
 							<span class="date"></span>
@@ -53,110 +53,144 @@
 						list:[
 							{
 								title:'白鹤展翅',
-								src:'/static/video/animal/baihezhanchi.mp4'
+								src:'/static/video/animal/baihezhanchi.mp4',
+								poster:'/static/poster/animal/baihezhanchi.png',
 							},{
 								title:'干坑梅花鹿母子添毛',
-								src:'/static/video/animal/gankengmeihualumuzitianmao.mp4'
+								src:'/static/video/animal/gankengmeihualumuzitianmao.mp4',
+								poster:'/static/poster/animal/gankengmeihualumuzitianmao.png',
 							},{
 								title:'华南梅花鹿3--千顷塘',
-								src:'/static/video/animal/huananmeihualu-3.mp4'
+								src:'/static/video/animal/huananmeihualu-3.mp4',
+								poster:'/static/poster/animal/huananmeihualu-3.png',
 							},{
 								title:'华南梅花鹿--千顷塘',
-								src:'/static/video/animal/huananmeihualu.mp4'
+								src:'/static/video/animal/huananmeihualu.mp4',
+								poster:'/static/poster/animal/huananmeihualu.png',
 							},{
 								title:'龙塘山大群燕雀',
-								src:'/static/video/animal/longtangshandaqunyanque.mp4'
+								src:'/static/video/animal/longtangshandaqunyanque.mp4',
+								poster:'/static/poster/animal/longtangshandaqunyanque.png',
 							},{
 								title:'龙塘山鬣羚',
-								src:'/static/video/animal/longtangshanlieling.mp4'
+								src:'/static/video/animal/longtangshanlieling.mp4',
+								poster:'/static/poster/animal/longtangshanlieling.png',
 							},{
 								title:'龙塘山猕猴群',
-								src:'/static/video/animal/longtangshanmihouqun.mp4'
+								src:'/static/video/animal/longtangshanmihouqun.mp4',
+								poster:'/static/poster/animal/longtangshanmihouqun.png',
 							},{
 								title:'龙塘山野猪大背小',
-								src:'/static/video/animal/longtangshanyezhudabeixiao.mp4'
+								src:'/static/video/animal/longtangshanyezhudabeixiao.mp4',
+								poster:'/static/poster/animal/longtangshanyezhudabeixiao.png',
 							},{
 								title:'马啸勺鸡对',
-								src:'/static/video/animal/maxiaoshaojidui.mp4'
+								src:'/static/video/animal/maxiaoshaojidui.mp4',
+								poster:'/static/poster/animal/maxiaoshaojidui.png',
 							},{
 								title:'马啸猪獾群',
-								src:'/static/video/animal/maxiaozhuhuanqun.mp4'
+								src:'/static/video/animal/maxiaozhuhuanqun.mp4',
+								poster:'/static/poster/animal/maxiaozhuhuanqun.png',
 							},{
 								title:'梅花鹿-1',
 								src:'/static/video/animal/meihualu-1.mp4',
-								poster:'/static/poster/welfare/welfare_1.png'
+								poster:'/static/poster/animal/meihualu-1.png',
 							},{
 								title:'梅花鹿-2',
-								src:'/static/video/animal/meihualu-2.mp4'
+								src:'/static/video/animal/meihualu-2.mp4',
+								poster:'/static/poster/animal/meihualu-2.png',
 							},{
 								title:'梅花鹿-3',
-								src:'/static/video/animal/meihualu-3.mp4'
+								src:'/static/video/animal/meihualu-3.mp4',
+								poster:'/static/poster/animal/meihualu-3.png',
 							},{
 								title:'梅花鹿-4',
-								src:'/static/video/animal/meihualu-4.mp4'
+								src:'/static/video/animal/meihualu-4.mp4',
+								poster:'/static/poster/animal/meihualu-4.png',
 							},{
 								title:'梅花鹿-5',
-								src:'/static/video/animal/meihualu-5.mp4'
+								src:'/static/video/animal/meihualu-5.mp4',
+								poster:'/static/poster/animal/meihualu-5.png',
 							},{
 								title:'梅花鹿-6',
-								src:'/static/video/animal/meihualu-6.mp4'
+								src:'/static/video/animal/meihualu-6.mp4',
+								poster:'/static/poster/animal/meihualu-6.png',
 							},{
 								title:'梅花鹿-7',
-								src:'/static/video/animal/meihualu-7.mp4'
+								src:'/static/video/animal/meihualu-7.mp4',
+								poster:'/static/poster/animal/meihualu-7.png',
 							},{
 								title:'梅花鹿-8',
-								src:'/static/video/animal/meihualu-8.mp4'
+								src:'/static/video/animal/meihualu-8.mp4',
+								poster:'/static/poster/animal/meihualu-8.png',
 							},{
 								title:'梅花鹿-9',
-								src:'/static/video/animal/meihualu-9.mp4'
+								src:'/static/video/animal/meihualu-9.mp4',
+								poster:'/static/poster/animal/meihualu-9.png',
 							},{
 								title:'梅花鹿-10',
-								src:'/static/video/animal/meihualu-10.mp4'
+								src:'/static/video/animal/meihualu-10.mp4',
+								poster:'/static/poster/animal/meihualu-10.png',
 							},{
 								title:'梅花鹿-11',
-								src:'/static/video/animal/meihualu-11.mp4'
+								src:'/static/video/animal/meihualu-11.mp4',
+								poster:'/static/poster/animal/meihualu-11.png',
 							},{
 								title:'梅花鹿-12',
-								src:'/static/video/animal/meihualu-12.mp4'
+								src:'/static/video/animal/meihualu-12.mp4',
+								poster:'/static/poster/animal/meihualu-12.png',
 							},{
 								title:'梅花鹿-13',
-								src:'/static/video/animal/meihualu-13.mp4'
+								src:'/static/video/animal/meihualu-13.mp4',
+								poster:'/static/poster/animal/meihualu-13.png',
 							},{
 								title:'梅花鹿刚掉角',
-								src:'/static/video/animal/meihualugangdiaojiao.mp4'
+								src:'/static/video/animal/meihualugangdiaojiao.mp4',
+								poster:'/static/poster/animal/meihualugangdiaojiao.png',
 							},{
 								title:'梅花鹿和小鹿和平相处',
-								src:'/static/video/animal/meihualuandxiaolupeace.mp4'
+								src:'/static/video/animal/meihualuandxiaolupeace.mp4',
+								poster:'/static/poster/animal/meihualuandxiaolupeace.png',
 							},{
 								title:'梅花鹿觅食',
-								src:'/static/video/animal/meihualumishi.mp4'
+								src:'/static/video/animal/meihualumishi.mp4',
+								poster:'/static/poster/animal/meihualumishi.png',
 							},{
 								title:'梅花鹿母子',
-								src:'/static/video/animal/meihualumuzi.mp4'
+								src:'/static/video/animal/meihualumuzi.mp4',
+								poster:'/static/poster/animal/meihualumuzi.png',
 							},{
 								title:'梅花鹿母子舔毛',
-								src:'/static/video/animal/meihualumuzitianmao.mp4'
+								src:'/static/video/animal/meihualumuzitianmao.mp4',
+								poster:'/static/poster/animal/meihualumuzitianmao.png',
 							},{
 								title:'梅花鹿群',
-								src:'/static/video/animal/meihualuqun.mp4'
+								src:'/static/video/animal/meihualuqun.mp4',
+								poster:'/static/poster/animal/meihualuqun.png',
 							},{
 								title:'梅花鹿群-1',
-								src:'/static/video/animal/meihualuqun-1.mp4'
+								src:'/static/video/animal/meihualuqun-1.mp4',
+								poster:'/static/poster/animal/meihualuqun-1.png',
 							},{
 								title:'梅花鹿群-2',
-								src:'/static/video/animal/meihualuqun-2.mp4'
+								src:'/static/video/animal/meihualuqun-2.mp4',
+								poster:'/static/poster/animal/meihualuqun-2.png',
 							},{
 								title:'梅花鹿一家',
-								src:'/static/video/animal/meihualuyijia.mp4'
+								src:'/static/video/animal/meihualuyijia.mp4',
+								poster:'/static/poster/animal/meihualuyijia.png',
 							},{
 								title:'梅花鹿抓痒',
-								src:'/static/video/animal/meihualuzhuayang.mp4'
+								src:'/static/video/animal/meihualuzhuayang.mp4',
+								poster:'/static/poster/animal/meihualuzhuayang.png',
 							},{
 								title:'母鹿与小鹿',
-								src:'/static/video/animal/muluandxiaolu.mp4'
+								src:'/static/video/animal/muluandxiaolu.mp4',
+								poster:'/static/poster/animal/muluandxiaolu.png',
 							},{
 								title:'缺腿的梅花鹿',
-								src:'/static/video/animal/quetuidemeihualu.mp4'
+								src:'/static/video/animal/quetuidemeihualu.mp4',
+								poster:'/static/poster/animal/quetuidemeihualu.png',
 							}
 						],
 						header:'/static/animal_title.png',
@@ -233,7 +267,7 @@
 					}
 
 					// 初始化插件参数及插入插件
-					WebVideoCtrl.I_InitPlugin(1300, 690, {
+					WebVideoCtrl.I_InitPlugin(1300, 750, {
 						bWndFull: true, //是否支持单窗口双击全屏，默认支持 true:支持 false:不支持
 						iWndowType: 1,
 						cbSelWnd: function(xmlDoc) {