diff options
| author | Geo Halkiadakis <gchalkiadakis@sklavenitis.co.gr> | 2024-11-26 11:57:19 +0200 |
|---|---|---|
| committer | Geo Halkiadakis <gchalkiadakis@sklavenitis.co.gr> | 2024-11-26 11:57:19 +0200 |
| commit | 943f66c1c60c41c56b8ef0066478b69251f9048f (patch) | |
| tree | 359295597c70fd02ad79ee916e1ff5ac12d914c2 /esm/scripts/presentation.js | |
| parent | ac57b98df77219c8529c4547b13366df3e998b2c (diff) | |
| download | slidetray-943f66c1c60c41c56b8ef0066478b69251f9048f.tar.gz slidetray-943f66c1c60c41c56b8ef0066478b69251f9048f.tar.bz2 slidetray-943f66c1c60c41c56b8ef0066478b69251f9048f.zip | |
impelement base_url and points of interest feature
Diffstat (limited to 'esm/scripts/presentation.js')
| -rw-r--r-- | esm/scripts/presentation.js | 36 |
1 files changed, 32 insertions, 4 deletions
diff --git a/esm/scripts/presentation.js b/esm/scripts/presentation.js index 61e6afc..42d8c05 100644 --- a/esm/scripts/presentation.js +++ b/esm/scripts/presentation.js @@ -2,6 +2,7 @@ export default { name: 'test', title: 'some presentation title', + base_url: 'https://swiperjs.com/demos/images', effect: 'flip', pagination: 'dynamic', @@ -40,10 +41,37 @@ export default { } `, slides: [ - { image: 'https://swiperjs.com/demos/images/nature-1.jpg' }, - { image: 'https://swiperjs.com/demos/images/nature-2.jpg' }, - { image: 'https://swiperjs.com/demos/images/nature-3.jpg' }, - { image: 'https://swiperjs.com/demos/images/nature-4.jpg' }, + { image: 'nature-1.jpg' }, + { + image: 'nature-2.jpg', + poi: [ + { + text: 'some label', + style: [ + `{ position: absolute; top: 75%; left: 25%; + font-size: 3em; font-family:Arial; font-weight:bold; + color:#fff; background:#3337; + border-radius: 6px; padding: 4px 8px; }`, + ':hover { color:red; background: #222; }' + ] + }, + { + text: 'some link', + link: 'https://www.sklavenitis.gr', + style: [ + ` a { position: absolute; top: 80%; left: 25%; + font-size: 3em; font-family:Arial; font-weight:bold; + color:#fff; background:#3337; + border-radius: 6px; padding: 4px 8px; }`, + ' a:hover { color:red; background: #222; }' + ] + + } + ] + }, + { image: 'nature-3.jpg' }, + { image: 'nature-4.jpg' }, + { image: 'nature-5.jpg' } ] } |