Project2024
/
cms-system


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
							<!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">
    <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/styles.css">
    <link rel="stylesheet" type="text/css" href="{dreamer-cms:template /}assets/css/animate.min.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='loading.html'/}
    {dreamer-cms:include file='header.html'/}
    <main>
        <section>
            <div class="">
                <div>
                    {dreamer-cms:type typeid="04zc8871"}
                    <img style="width: 100%;object-fit: cover;" 
                    data-src="[field:typeimg/]" alt="[field:typenamecn/]"
                    src="{dreamer-cms:template /}assets/img/none.png" loading="lazy">
                    {/dreamer-cms:type}
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
        <section>
            <div class="">
                <div class="p-3 px-xl-5">
                    {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="">
                <h3 class="px-3 px-xl-5">团建照片</h3>
                <div class="pt-3 pt-xl-4">
                    {dreamer-cms:type typeid="ieu98721"}
                    <img data-src="[field:typeimg/]" 
                    src="{dreamer-cms:template /}assets/img/none.png"
                    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 wow fadeIn"
                        data-wow-duration="1000"
                            data-wow-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" 
                                data-src="[field:litpic/]" 
                                src="{dreamer-cms:template /}assets/img/none.png"
                                alt="[field:title/]" style="z-index: 5;" loading="lazy"/>
                            </div>
                        </div>
                        {/dreamer-cms:list}
                    </div>
                </div>
                <hr class="ahout-hr" style="color: #a69b9f;">
            </div>
        </section>
        <section>
            <div class="">
                <h3 class="px-3 px-xl-5">人员介绍</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 wow fadeIn" data-wow-duration="1000" data-wow-once="true">
                        <img class="auto-img" 
                        src="{dreamer-cms:template /}assets/img/none.png"
                        data-src="[field:litpic/]" loading="lazy"
                        alt="[field:title/]">
                    </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 type="text/javascript" src="{dreamer-cms:template /}assets/js/wow.min.js"></script>
    <script src="{dreamer-cms:template /}assets/js/main.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 <= 576) {
                ow = "s"
            } else {
                if (Owidth > 768 && Owidth <= 992) {
                    ow = "m"
                } else {
                    if (Owidth > 992 && Owidth <= 1200) {
                        ow = "l"
                    } else {
                        if (Owidth > 1200) {
                            ow = "xl"
                        }
                    }
                }
            }
            // console.log(ow)
            var fade = $(".team .fade-box")
            let flag = 0
            fade.each((index, element) => {
                $(element).attr("data-wow-delay", flag+"ms")
                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-wow-delay", dflag+"ms")
                dflag += 200
                if (ow == "s" || ow == "m" && (index + 1) % 4 == 0 || ow == "l" && (index + 1) % 6 == 0) {
                    dflag = 0
                }
            });

        })
    </script>
    <script src="{dreamer-cms:template /}assets/js/image.js"></script>
</body>

</html>