Widget:视频：修订间差异

来自HUIJIA FUN
可视化wikitext
无编辑摘要
无编辑摘要
第27行： 第27行：
   .video-container {
   .video-container {
     position: relative;
     position: relative;
     width: <!--{$width|default:425|validate:int|escape:'html'}-->px;
     width: 100%; /* Full width by default */
     height: <!--{$height|default:355|validate:int|escape:'html'}-->px;
     max-width: 640px; /* Optional: limit max width */
     margin-bottom: 15px;
     margin-bottom: 15px;
   }
   }
   .video-load-btn {
   .video-load-btn {
     position: absolute;
     position: absolute;
第44行： 第45行：
     z-index: 10;
     z-index: 10;
   }
   }
   .video-load-btn:hover {
   .video-load-btn:hover {
     background: #3367d6;
     background: #3367d6;
   }
   }
   .video-player {
   .video-player {
     width: 100%;
     width: 100%;
     height: 100%;
     height: auto; /* Maintain aspect ratio */
     display: none;
     display: none;
   }
   }
第55行： 第58行：


<div class="video-container">
<div class="video-container">
   <button class="video-load-btn" onclick="
  <!-- Load button -->
    const video = this.nextElementSibling;
   <button class="video-load-btn"
    video.style.display = 'block';
          onclick="const player=this.nextElementSibling; player.style.display='block'; player.src='<!--{$url|validate:url|escape:html|regex_replace:"#^(?!(https?:)?//).*#i":''}-->'; this.remove()">
    video.src = '<!--{$url|validate:url|escape:html|regex_replace:"#^(?!(https?:)?//).*#i":''}-->';
    video.muted = false;
    video.volume = 1;
    video.play().catch(() => console.warn('Autoplay blocked, user interaction required.'));
    this.remove();
  ">
     ▶ Load Video
     ▶ Load Video
   </button>
   </button>


  <!-- Video element with volume control -->
   <video class="video-player"
   <video class="video-player"
        width="<!--{$width|default:425|validate:int|escape:'html'}-->"
        height="<!--{$height|default:355|validate:int|escape:'html'}-->"
         controls
         controls
         preload="none">
         preload="none">
    <!-- Volume control is built-in to most modern browsers -->
    Your browser does not support the video tag.
   </video>
   </video>
</div>
</div>
</includeonly>
</includeonly>

2025年7月12日 (六) 14:05的版本

{{#widget:视频
|url=https://vip.123pan.cn/1826204916/5651071
|width=640
|height=auto
}}

This widget lets you embed HTML5 Video Media on your wiki page.

It was created by taipan.

Using this widget

For information on how to use this widget, see widget description page on MediaWikiWidgets.org.

Copy to your site

To use this widget on your site, install MediaWiki Widgets extension and copy the complete source code of this page to your wiki as page Widget:视频.

取自“https://huijia.fun/index.php?title=Widget:视频&oldid=1646”