Project2024
/
cms-system


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
							<!DOCTYPE html>
<html data-bs-theme="light" lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>test1</title>
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/Roboto.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/Roboto%20Slab.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/bs-theme-overrides.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/aos.min.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/Hero-Carousel-images.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/Navbar-Right-Links-icons.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/smjy-header.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/sticky-dark-top-nav-with-dropdown.css">
    <link rel="stylesheet" href="{dreamer-cms:template /}assets/css/styles.css">
    <style>
        .auto-img {
            height: 100% !important;
            object-fit: cover;
        }

        .team-img img {
            transform: scale(1);
            transition: all ease 0.5s;
        }

        @media (any-hover) {
            .team-img div {
                background-color: #4a575755;
                transition: all ease 0.5s;
            }

            .team-img:hover div {
                background-color: #ffffff00;
                transition: all ease 0.5s;
            }
        }

        .team-img:hover img {
            transform: scale(1.1);
            transition: all ease 0.5s;
        }
    </style>
</head>

<body>
    {dreamer-cms:include file='header.html'/}
    <main>
        <section>
            <div class="container">
                <div>
                    {dreamer-cms:type typeid="04zc8871"}
                    <img style="width: 100%;object-fit: cover;" src="[field:typeimg/]" loading="lazy">
                    {/dreamer-cms:type}
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
        <section>
            <div class="container">
                <div>
                    {dreamer-cms:type typeid="04zc8871"}
                    <div style="text-indent: 2em;color: #6b6767;">
                        [field:htmlcontent/]
                    </div>
                    {/dreamer-cms:type}
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
        <section>
            <div class="container">
                <h3>团建照片</h3>
                <div class="pt-3 pt-xl-4">
                    {dreamer-cms:type typeid="ieu98721"}
                    <img loading="lazy" src="[field:typeimg/]" width="100%" height="50%" alt="[field:typenamecn/]"
                        style="object-fit: cover;">
                    {/dreamer-cms:type}
                    <div class="row gx-4 row-cols-1 row-cols-lg-3 row-cols-xl-3 row-cols-xxl-3 team">
                        {dreamer-cms:list typeid="ieu98721" pagenum="0" flag="p" pagesize="3"}
                        <div class="col mt-xl-4 mt-md-4 mt-2 fade-box" data-aos="zoom-in-right"
                            data-aos-duration="1000" data-aos-once="true">
                            <div class="team-img" style="width: 100%;height: 100%;position: relative;overflow: hidden;">
                                <div style="height: inherit;width: inherit;position: absolute;top: 0; z-index: 10;">
                                </div>
                                <img class="auto-img" src="[field:litpic/]" loading="lazy" alt="[field:title/]"
                                    style="z-index: 5;" />
                            </div>
                        </div>
                        {/dreamer-cms:list}
                    </div>
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
        <section>
            <div class="container">
                <h3>人员介绍</h3>
                <div
                    class="person row gx-0 gy-2 gx-sm-3 gx-md-3 gx-lg-3 gx-xl-3 gx-xxl-3 
                    row-cols-1 
                    row-cols-sm-4 
                    row-cols-xl-6 
                    pt-xl-4 
                    row-cols-lg-6 
                    pt-3 
                    pt-xl-4">
                    {dreamer-cms:list typeid="16nm8896" pagenum="0" flag="p"}
                    <div class="col fade-box" data-aos="zoom-in-right" data-aos-duration="1000" data-aos-once="true">
                        <img class="auto-img" src="[field:litpic/]" loading="lazy">
                    </div>
                    {/dreamer-cms:list}
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
    </main>
    {dreamer-cms:include file='footer.html'/}
    <script src="{dreamer-cms:template /}assets/js/jquery.min.js"></script>
    <script src="{dreamer-cms:template /}assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="{dreamer-cms:template /}assets/js/aos.min.js"></script>
    <script src="{dreamer-cms:template /}assets/js/bs-init.js"></script>
    <script>
        $(function () {
            var Owidth = document.querySelector("html").offsetWidth;
            var ow;
            if (Owidth <= 768) {
                ow = "s"
            } else {
                if (Owidth > 768 && Owidth <= 992) {
                    ow = "m"
                } else {
                    if (Owidth > 992 && Owidth <= 1200) {
                        ow = "l"
                    } else {
                        if (Owidth > 1200) {
                            ow = "xl"
                        }
                    }
                }
            }
            var fade = $(".team .fade-box")
            let flag = 0
            fade.each((index, element) => {
                $(element).attr("data-aos-delay", flag)
                flag += 200
                if(ow == "l" && (index+1)%3==0 || ow=="s") {
                   flag = 0
                }
            });
            let dflag = 0
            var dfade = $(".person .fade-box")
            dfade.each((index, element) => {
                $(element).attr("data-aos-delay", dflag)
                dflag += 200
                if(ow=="s" || ow == "m" && (index+1)%4==0 || ow == "l" && (index+1)%6==0){
                    dflag = 0
                }
            });
        })
    </script>
</body>

</html>