mirror/reveal.js
1
0
Fork 0
mirror of https://github.com/hakimel/reveal.js.git synced 2025-08-27 00:16:53 +02:00
Code Issues Releases Wiki Activity

add support for data-preview-link on any element type (prev only a)

Browse Source
This commit is contained in:
Hakim El Hattab
2025-03-20 13:52:28 +01:00
parent b3fd27d071
commit 94716f9e51
3 changed files with 42 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
examples/preview-overlays.html
View File

@@ -82,8 +82,46 @@
<div class="r-vstack items-start">
<h5>Iframes</h5>
<a href="https://hakim.se">https://hakim.se | data-preview-link</a>
<a data-preview-link href="https://hakim.se">https://hakim.se | data-preview-link</a>
<br />
<a data-preview-link="false" href="https://hakim.se">https://hakim.se | data-preview-link=false</a>
<br />
<figure>
<figcaption>Preview link from an image</figcaption>
<img height="50" src="https://static.slid.es/images/alphabet/v1/a.png" data-preview-link="https://hakim.se">
</figure>
</div>
</div>
</section>
<section style="text-align: left;">
<h2>Lightbox</h2>
<div class="r-hstack items-start justify-start">
<div class="r-vstack items-start">
<h5>Images</h5>
<figure>
<img height="100" src="https://static.slid.es/images/alphabet/v1/a.png" data-preview-image data-preview-fit="contain">
</figure>
</div>
<div style="width: 1px; height: 20vh; margin: 0 3rem;background-color: #222;"></div>
<div class="r-vstack items-start">
<h5>Videos</h5>
<figure>
<video height="100" src="https://static.slid.es/site/homepage/v1/homepage-video-editor.mp4" data-preview-video></video>
</figure>
</div>
<div style="width: 1px; height: 20vh; margin: 0 3rem;background-color: #222;"></div>
<div class="r-vstack items-start">
<h5>Iframes</h5>
<a style="font-size: 28px;" data-preview-link href="https://hakim.se">https://hakim.se</a>
</div>
</div>