style:首页视频 产品详情样式修改

app/index/view/index/index.html

@@ -102,14 +102,11 @@
     <!-- 视频宣传 -->
     {notempty name="video"}
     <div class="hotProduct">
-      <div class="hotvideo">
-        <iframe src="{$video.video}" title="YouTube video player" style="width:100%;height:67rem;z-index:9999;"
-          frameborder="0"
-          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-          allowfullscreen id="videoElement"></iframe>
-      </div>
-      <img src="{$video.image}" class="hotImg" />
-    </div>
+			<div class="hotvideo"> 
+				<video src="{$video.video}" style="max-height:50rem;z-index:9999;width: 100%;object-fit: cover;" autoplay muted loop controls></video>
+			</div>
+			<img src="{$video.image}" class="hotImg" />
+		</div>
     {/notempty}
     <!-- 场景介绍 -->
     {notempty name="scenes"}
@@ -268,6 +265,23 @@
     $(".oficlose").on("click", function () {
       $(".oricofixd-info").hide();
     });
+    // 视频
+			const video = $('#oricoVideo');
+			const videoContainer = $('.hotvideo');
+			const img = $('.hotImg');
+			// 监听视频加载完成事件
+			video.on('loadedmetadata', function() {
+				// 显示视频容器，隐藏图片
+				videoContainer.css('display', 'block');
+				img.hide();
+			});
+			// 处理视频加载失败（可选）
+			video.on('error', function() {
+				videoContainer.css('display', 'none');
+				console.error('视频加载失败:', video.attr('src'));
+				// 可在此添加失败提示，如显示错误信息或保留图片
+				img.show();
+			});
   });
   $(function () {
     // banner轮播