bmy/Vue_dbui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 00:57:27 +08:00
commit 18df0f5e4b
2548 changed files with 253280 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
vue-ydui/example/routers/lightbox.vue Normal file
View File

@@ -0,0 +1,44 @@
<template>
<yd-layout title="LightBox">
<p style="color: #00c3f5;padding-bottom: 5px;padding-left: 5px;font-size: 15px;" class="demo-small-pitch">
参照 京东APP 和 <a href="http://photoswipe.com/" style="text-decoration: underline;">Photoswipe</a> 功能实现。
</p>
<yd-lightbox>
<div class="demo-lightbox">
<div>
<yd-lightbox-img :src="baseurl + 'scenery_s01.jpg'" :original="baseurl + 'scenery_01.jpg'"></yd-lightbox-img>
</div>
<div>
<div>
<div><yd-lightbox-img :src="baseurl + 'scenery_s02.jpg'" :original="baseurl + 'scenery_02.jpg'"></yd-lightbox-img></div>
<div><yd-lightbox-img :src="baseurl + 'scenery_s03.jpg'" :original="baseurl + 'scenery_03.jpg'"></yd-lightbox-img></div>
</div>
<div>
<div><yd-lightbox-img :src="baseurl + 'scenery_s04.jpg'" :original="baseurl + 'scenery_04.jpg'"></yd-lightbox-img></div>
<div><yd-lightbox-img :src="baseurl + 'scenery_s05.jpg'" :original="baseurl + 'scenery_05.jpg'"></yd-lightbox-img></div>
</div>
</div>
</div>
<yd-lightbox-txt>
<h1 style="font-size: 15px;margin-bottom: 8px;color: #00c3f5;text-align: right;" slot="top">美丽风景</h1>
<div slot="content" style="text-align: right;">
<p>风景指的是供观赏的自然风光、景物，包括自然景观和人文景观</p>
<p>风景是由光对物的反映所显露出来的一种景象</p>
<p>犹言风光或景物、景色等，含义广泛</p>
<p>而且还有一大部分作品是借景抒情，寓情于景</p>
</div>
</yd-lightbox-txt>
</yd-lightbox>
</yd-layout>
</template>
<script type="text/babel">
export default {
data() {
return {
baseurl: 'http://static.ydcss.com/uploads/lightbox/'
}
}
}
</script>