IMPR: minor fixtures

This commit is contained in:
Tony Air 2021-01-31 19:08:55 +07:00
parent 4bd702c753
commit e32aa62444
2 changed files with 93 additions and 81 deletions

View File

@ -5,9 +5,10 @@
}
</style>
<h2>Loading data</h2>
<div id="MetaLightboxContainer">
<h2>Loading data</h2>
<p>
<p>
<a
href="../src/img/photo1.png"
data-toggle="lightbox"
@ -27,11 +28,13 @@
Load Partial AJAX HTML </a
><br />
<a href="../src/not-found.html" data-toggle="lightbox"> Not Found test </a>
</p>
<a href="../src/not-found.html" data-toggle="lightbox">
Not Found test
</a>
</p>
<h2>Embeds</h2>
<p>
<h2>Embeds</h2>
<p>
<a
href="https://www.youtube.com/watch?v=WYvZZYthDRI"
data-toggle="lightbox"
@ -59,16 +62,20 @@
data-embed="true"
>Embed Instagram</a
>
</p>
</p>
<h2>Other</h2>
<p>
<a href="../src/img/photo2.jpg" data-toggle="lightbox" data-gallery="demo">
<h2>Other</h2>
<p>
<a
href="../src/img/photo2.jpg"
data-toggle="lightbox"
data-gallery="demo"
>
Use [data-toggle="lightbox"] attribute to attach lightbox action and
[href] to specify URL.
</a>
</p>
<p>
</p>
<p>
<a
href="../src/img/photo1.png"
data-toggle="lightbox"
@ -78,14 +85,17 @@
Use [data-gallery="YOUR_GALLERY_NAME"] to group ligthboxes with
next/prev arrows
</a>
</p>
<p
</p>
<p
data-toggle="lightbox"
data-href="https://youtu.be/GgnClrx8N2k"
data-gallery="demo"
data-title="Yes you can link vimeo and youtube videos as long as AJAX content"
>
Use [data-toggle="lightbox"] + [data-href] attribute to toggle lightbox on
regular elements.
>
Use [data-toggle="lightbox"] + [data-href] attribute to toggle lightbox
on regular elements.
<b>Click me!</b>
</p>
</p>
<div id="MetaLightboxApp"></div>
</div>

View File

@ -8,8 +8,10 @@ import React from 'react';
import ReactDOM from 'react-dom';
import MetaWindow from './_window.jsx';
const M = ReactDOM.render(<MetaWindow />, document.getElementById('App'));
ReactDOM.render(<MetaWindow />, document.getElementById('App'));
const M = ReactDOM.render(
<MetaWindow />,
document.getElementById('MetaLightboxApp'),
);
// display custom HTML content manually using JS
//M.setContent('<b>ZZZZZZZZZAAAA11<a href="/">BBBB</a>122</b>');