Widget:YouTubeEmbed: Difference between revisions
((by SublimeText.Mediawiker)) |
((by SublimeText.Mediawiker)) |
||
| (One intermediate revision by the same user not shown) | |||
| Line 2: | Line 2: | ||
<div style="background-image: url('https://img.youtube.com/vi/<!--{$id|default:''}-->/sddefault.jpg'); background-size: cover; background-position: 50% 50%;"></div> | <div style="background-image: url('https://img.youtube.com/vi/<!--{$id|default:''}-->/sddefault.jpg'); background-size: cover; background-position: 50% 50%;"></div> | ||
<img src="<!--{$iconoverlay|default:''}-->" width="100px" height="auto" class="position-absolute opac-50" style="top: 4px; right: 4px;"> | <img src="<!--{$iconoverlay|default:''}-->" width="100px" height="auto" class="position-absolute opac-50" style="top: 4px; right: 4px;"> | ||
<div class="d-flex justify-content-center align-items-center"> | |||
<div class="d-flex justify-content-center align-items- | |||
<img src="<!--{$iconoverlayCentered|default:''}-->" width="200px" height="auto" class="opac-50"> | <img src="<!--{$iconoverlayCentered|default:''}-->" width="200px" height="auto" class="opac-50"> | ||
</div> | </div> | ||
<a class="pop-hover" href="https://www.youtube.com/watch?v=<!--{$id|default:''}-->&t=<!--{$delay|default:''}-->s" data-fancybox data-width="854" data-height="480"></a> | |||
</div><style> | </div><style> | ||
.video-container { | .video-container { | ||
Latest revision as of 09:16, 7 August 2025
<img src="" width="100px" height="auto" class="position-absolute opac-50" style="top: 4px; right: 4px;">
<img src="" width="200px" height="auto" class="opac-50">
<a class="pop-hover" href="https://www.youtube.com/watch?v=&t=s" data-fancybox data-width="854" data-height="480"></a>
<style>
.video-container { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .video-container div, .video-container a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } </style>