get_gallery_detail.html 2.5 KB
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>星球画廊详情</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/js/swiper4/swiper.min.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/show.css">
</head>

<body>
    <include file="public@header"/>
    <div class="show_8">
        <div class="show_8_box">
            <div class="gallery-top">
                <ul class="swiper-wrapper">
                    <volist name="res['image_url']" id="vo">
                        <li class="swiper-slide">
                            <img src="{:cmf_get_image_url($vo.url)}" alt="">
                        </li>
                    </volist>
                </ul>
            </div>
            <h1 class="show_8_name">{$res.post_title}</h1>
            <div class="gallery-thumbs_box">
                <div class="gallery-thumbs">
                    <ul class="swiper-wrapper">
                        <volist name="res['image_url']" id="vo">
                            <li class="swiper-slide">
                                <img src="{:cmf_get_image_url($vo.url)}" alt="">
                            </li>
                        </volist>
                        </li>
                    </ul>
                    <span class="swiper-notification"></span>
                </div>
                <div class="swiper-button-prev8"></div>
                <div class="swiper-button-next8"></div>
            </div>

        </div>
    </div>
    <include file="public@footer"/>
    <script src="__TMPL__/public/assets/js/jquery-3.2.1.min.js"></script>
    <script src="__TMPL__/public/assets/js/swiper4/swiper.min.js"></script>
    <script src="__TMPL__/public/assets/js/public.js"></script>
    <script>
        var galleryThumbs = new Swiper('.gallery-thumbs', {
            spaceBetween: 10,
            slidesPerView: 4,
            freeMode: true,
            loop:true,
            watchSlidesVisibility: true,
            watchSlidesProgress: true,
        });
        var galleryTop = new Swiper('.gallery-top', {
            spaceBetween: 10,
            loop:true,
            navigation: {
                nextEl: '.swiper-button-next8',
                prevEl: '.swiper-button-prev8',
            },

            thumbs: {
                swiper: galleryThumbs
            }
        });
    </script>
</body>

</html>