|
|
@@ -0,0 +1,51 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <meta charset="utf-8" />
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
+ <title>Fancybox demo</title>
|
|
|
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css" />
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-1.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-1.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-2.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-2.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-3.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-3.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-4.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-4.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-5.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-5.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-6.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-6.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-7.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-7.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+<a class="venoimg" href="https://swiperjs.com/demos/images/nature-8.jpg" data-fancybox="gallery">
|
|
|
+ <img width="100" class="img-fluid" src="https://swiperjs.com/demos/images/nature-8.jpg" alt="" srcset="">
|
|
|
+</a>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js"></script>
|
|
|
+<script>
|
|
|
+ // console.log(Fancybox);
|
|
|
+ Fancybox.bind("[data-fancybox]");
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
sicong