<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="public/favicon.png">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页_山西金宇科林科技有限公司</title>
    <meta name="keywords" content="公司简介,山西金宇科林科技有限公司">
    <meta name="description"
          content="公司简介-山西金宇科林科技有限公司西金宇科林科技有限公司成立于2007年，是利用煤矸石研制、生产、推广超细煅烧高岭土的高新技术企业。">
    <link rel="stylesheet" href="assets/css/main.css">
    <link rel="stylesheet" href="assets/css/home.css">
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/vue.global.js"></script>
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/element-plus.js"></script>
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/jquery.js"></script>
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/i18next-1.11.2.min.js"></script>
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/axios.min.js"></script>
    <script src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/plugins/lodash.min.js"></script>
</head>
<body>
<div id="home" class="home">
    <div class="home-box">
        <!-- 导航-->
        <div class="nav">
            <div class="nav-content">
                <div class="nav-content-border">
                    <!-- logo -->
                    <div class="nav-logo">
                        <a href="home.html" title="首页" class="nav-logo-a">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo.png" class="nav-logo-img" @click="location.href('')">
                        </a>
                    </div>
                    <!-- 副导航 -->
                    <div class="nav-right">
                        <div class="nav-auxiliaryNav-list">
                            <div class="nav-auxiliaryNav-item">
                                <a href="shopping.html" data-i18n="nav.auxiliaryNav.shopping" title="商城"></a>
                            </div>
                            <div class="nav-auxiliaryNav-item">
                                <a href="intranet.html" data-i18n="nav.auxiliaryNav.intranet" title="内网"></a>
                            </div>
                            <div class="nav-auxiliaryNav-item">
                                <a href="recruit.html" data-i18n="nav.auxiliaryNav.recruit" title="招聘"></a>
                            </div>
                            <div class="nav-auxiliaryNav-item">
                                <a href="complaints.html" data-i18n="nav.auxiliaryNav.complaints" title="投诉"></a>
                            </div>
                        </div>
                        <!-- 主导航 -->
                        <div class="nav-mainNav-box">
                            <div class="nav-mainNav-list">
                                <div class="nav-mainNav-item mainNav-application">
                                    <a href="#" data-i18n="nav.mainNav.application" title="应用领域"></a>
                                </div>
                                <div class="nav-mainNav-item mainNav-technology">
                                    <a href="#" data-i18n="nav.mainNav.technology" title="技术中心"></a>
                                </div>
                                <div class="nav-mainNav-item mainNav-about_us">
                                    <a href="#" data-i18n="nav.mainNav.about_us" title="关于我们"></a>
                                </div>
                                <div class="nav-mainNav-item mainNav-news">
                                    <a href="news.html" data-i18n="nav.mainNav.news" title="新闻中心"></a>
                                </div>
                                <div class="nav-mainNav-item mainNav-contact_us">
                                    <a href="contact.html" data-i18n="nav.mainNav.contact_us" title="联系我们"></a>
                                </div>
                            </div>
                            <!-- 语言切换 -->
                            <div class="nav-mainNav-language">
                                    <span @click="statesReactive.toggleLanguage">
                                        {{ statesReactive.language == 'en-US' ? 'CN' : 'EN' }}
                                    </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- hover 时候展示的子类 -->
            <div class="nav-sub">
                <!-- 应用领域 -->
                <div class="nav-sub-application nav-sub-list">
                    <div class="nav-application-item nav-sub-item" onclick="window.location.href='application.html?type=1'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/zaozhi.png" title="造纸" alt="造纸">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.application_sub_page.paper"
                             title="造纸">
                        </div>
                    </div>
                    <div class="nav-application-item nav-sub-item" onclick="window.location.href='application.html?type=2'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/tuliao.png" title="涂料" alt="涂料">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.application_sub_page.paints"
                             title="涂料"></div>
                    </div>
                    <div class="nav-application-item nav-sub-item" onclick="window.location.href='application.html?type=3'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/xiangjiao.png" title="橡胶" alt="橡胶">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.application_sub_page.rubber"
                             title="橡胶"></div>
                    </div>
                    <div class="nav-application-item nav-sub-item" onclick="window.location.href='application.html?type=4'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/qicheqi.png" title="汽车漆" alt="汽车漆">
                        </div>
                        <div class="nav-sub-item-title"
                             data-i18n="pages.application_sub_page.automotive_paints" title="汽车漆"></div>
                    </div>
                    <div class="nav-application-item nav-sub-item" onclick="window.location.href='application.html?type=5'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/gongchengsuliao.png" title="工程塑料" alt="工程塑料">
                        </div>
                        <div class="nav-sub-item-title"
                             data-i18n="pages.application_sub_page.engineering_plastics" title="工程塑料">
                        </div>
                    </div>
                </div>
                <!-- 技术中心 -->
                <div class="nav-sub-technology nav-sub-list">
                    <div class="nav-technology-item nav-sub-item" onclick="window.location.href='technology.html?type=1'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/zhongxinjieshao.png" title="中心介绍" alt="中心介绍">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.technology_sub_page.introduction_center"
                             title="中心介绍"></div>
                    </div>
                    <div class="nav-technology-item nav-sub-item" onclick="window.location.href='technology.html?type=2'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/kejichengguo.png" title="科技成果" alt="科技成果">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.technology_sub_page.technology_achievement"
                             title="科技成果"></div>
                    </div>
                    <div class="nav-technology-item nav-sub-item" onclick="window.location.href='technology.html?type=3'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/jishudongtai.png" title="技术动态" alt="技术动态">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.technology_sub_page.technology_dynamics"
                             title="技术动态"></div>
                    </div>
                </div>
                <!-- 关于我们 -->
                <div class="nav-sub-about_us nav-sub-list">
                    <div class="nav-about_us-item nav-sub-item" onclick="window.location.href='about.html?type=1'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/gongsijianjie.png" title="公司简介" alt="公司简介">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.about_us_sub_page.company_profile"
                             title="公司简介"></div>
                    </div>
                    <div class="nav-about_us-item nav-sub-item" onclick="window.location.href='about.html?type=2'">
                        <div class="nav-sub-item-img">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/qiyeyuanjing.png" title="企业愿景" alt="企业愿景">
                        </div>
                        <div class="nav-sub-item-title" data-i18n="pages.about_us_sub_page.corporate_vision"
                             title="企业愿景"></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 内容区 -->
        <div class="home-content content">
            <!--致力于客户成功-->
            <div class="home-1">
                <div class="home-modal-1"></div>
                <div class="home-containt-1">
                    <div class="home-containt-zh">致力于客户成功</div>
                    <div class="home-containt-en">COMMITTED TO CUSTOMER SUCCESS</div>
                </div>
            </div>
            <!--造纸领域-->
            <div class="home-2">
                <div class="home-modal-2"></div>
                <div class="home-containt-2">
                    <div class="home-containt-zh home-containt-zh-color" data-i18n="main.home.zaozhi_title" title="造纸领域"></div>
                    <div class="home-containt-en home-containt-en-color" data-i18n="main.home.zaozhi_info" title="热敏纸、装饰纸、白板纸、无碳复写纸"></div>
                    <div class="home-containt-btns margin-top-364">
                        <div class="btns-left" data-i18n="main.home.go_shopping" title="立即购买" onclick="window.location.href='shopping.html?type=1'"></div>
                        <div class="btns-right" data-i18n="main.home.watch_detail" title="查看详情" onclick="window.location.href='application.html?type=1'"></div>
                    </div>
                </div>
                <div class="home-right-shop" v-show="homeReactive.list.zaozhi.length">
                    <div v-for="(item, index) in homeReactive.list.zaozhi" :key="index" class="right-shop-item" @click="homeReactive.goShopping(item)">
                        <div class="right-shop-title">{{item.productName}}</div>
                        <div class="right-shop-image">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/arrow_right.png" class="hover-image">
                        </div>
                    </div>
                </div>
            </div>
            <!--涂料领域-->
            <div class="home-3">
                <div class="home-containt-3">
                    <div class="home-containt-zh" data-i18n="main.home.tuliao_title" title="涂料领域"></div>
                    <div class="home-containt-en" data-i18n="main.home.tuliao_info" title="工业涂料、建筑涂料"></div>
                    <div class="home-containt-btns margin-top-364">
                        <div class="btns-left" data-i18n="main.home.go_shopping" title="立即购买" onclick="window.location.href='shopping.html?type=2'"></div>
                        <div class="btns-right" data-i18n="main.home.watch_detail" title="查看详情" onclick="window.location.href='application.html?type=2'"></div>
                    </div>
                </div>
                <div class="home-right-shop" v-show="homeReactive.list.tuliao.length">
                    <div v-for="(item, index) in homeReactive.list.tuliao" :key="index" class="right-shop-item-te" @click="homeReactive.goShopping(item)">
                        <div class="right-shop-title-te">{{item.productName}}</div>
                        <div class="right-shop-image">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/arrow_right_active.png" class="hover-image">
                        </div>
                    </div>
                </div>
            </div>
            <!--橡胶领域-->
            <div class="home-4">
                <div class="home-containt-4">
                    <div class="home-containt-zh home-containt-zh-color" data-i18n="main.home.xiangjiao_title" title="橡胶领域"></div>
                    <div class="home-containt-en home-containt-en-color" data-i18n="main.home.xiangjiao_info" title="线缆、密封条、轮胎、胶塞"></div>
                    <div class="home-containt-btns margin-top-364">
                        <div class="btns-left" data-i18n="main.home.go_shopping" title="立即购买" onclick="window.location.href='shopping.html?type=3'"></div>
                        <div class="btns-right" data-i18n="main.home.watch_detail" title="查看详情" onclick="window.location.href='application.html?type=3'"></div>
                    </div>
                </div>
                <div class="home-right-shop" v-show="homeReactive.list.xiangjiao.length">
                    <div v-for="(item, index) in homeReactive.list.xiangjiao" :key="index" class="right-shop-item" @click="homeReactive.goShopping(item)">
                        <div class="right-shop-title">{{item.productName}}</div>
                        <div class="right-shop-image">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/arrow_right.png" class="hover-image">
                        </div>
                    </div>
                </div>
            </div>
            <!--汽车漆领域-->
            <div class="home-5">
                <div class="home-containt-5">
                    <div class="home-containt-zh home-containt-zh-color" data-i18n="main.home.qicheqi_title" title="汽车漆领域"></div>
                    <div class="home-containt-en home-containt-en-color" data-i18n="main.home.qicheqi_info" title="电泳漆"></div>
                    <div class="home-containt-btns margin-top-364">
                        <div class="btns-left" data-i18n="main.home.go_shopping" title="立即购买" onclick="window.location.href='shopping.html?type=4'"></div>
                        <div class="btns-right" data-i18n="main.home.watch_detail" title="查看详情" onclick="window.location.href='application.html?type=4'"></div>
                    </div>
                </div>
                <div class="home-right-shop" v-show="homeReactive.list.qicheqi.length">
                    <div v-for="(item, index) in homeReactive.list.qicheqi" :key="index" class="right-shop-item" @click="homeReactive.goShopping(item)">
                        <div class="right-shop-title">{{item.productName}}</div>
                        <div class="right-shop-image">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/arrow_right.png" class="hover-image">
                        </div>
                    </div>
                </div>
            </div>
            <!--工程塑料领域-->
            <div class="home-6">
                <div class="home-containt-6">
                    <div class="home-containt-zh home-containt-zh-color" data-i18n="main.home.gongchengsuliao_title" title="工程塑料领域"></div>
                    <div class="home-containt-en home-containt-en-color" data-i18n="main.home.gongchengsuliao_info" title="尼龙、PVC型材、PP膜"></div>
                    <div class="home-containt-btns margin-top-364">
                        <div class="btns-left" data-i18n="main.home.go_shopping" title="立即购买" onclick="window.location.href='shopping.html?type=5'"></div>
                        <div class="btns-right" data-i18n="main.home.watch_detail" title="查看详情" onclick="window.location.href='application.html?type=5'"></div>
                    </div>
                </div>
                <div class="home-right-shop"  v-show="homeReactive.list.gongchengsuliao.length">
                    <div v-for="(item, index) in homeReactive.list.gongchengsuliao" :key="index" class="right-shop-item" @click="homeReactive.goShopping(item)">
                        <div class="right-shop-title">{{item.productName}}</div>
                        <div class="right-shop-image">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/arrow_right.png" class="hover-image">
                        </div>
                    </div>
                </div>
            </div>
            <!-- 关于我们-->
            <div class="home-7">
                <div class="home-about">
                    <div class="home-about-containt">
                        <div class="home-left">
                            <div class="about-left-title">
                                <div class="line"></div>
                                <div data-i18n="main.home.about_title" class="title" title="山西金宇科林科技有限公司"></div>
                            </div>
                            <div class="about-left-text" data-i18n="main.home.about_text" title="致力客户成功、指引行业标准"></div>
                            <div class="about-left-info">
                                <p data-i18n="main.home.about_info1" title="山西金宇科林科技有限公司成立于2007年，是利用煤矸石研制、生产、推广超细煅烧高岭土的高新技术企业。公司靠多项技术专利、深厚的技术实力、可靠的产品质量被认定为省资源综合利用示范企业、省企业技术中心、省工程技术研究中心、省名牌产品企业、省民营科技企业、省“专精特新”企业、省两化融合贯标试点企业，2019年获得忻州市市长质量提名奖。"></p>
                                <p data-i18n="main.home.about_info2" title="企业占地面积280亩，员工360人，现具备年消化煤矸石60万吨，年生产煅烧高岭土50万吨的能力。公司产品主要应用于热敏纸、装饰纸、水性涂料、电泳漆、橡胶塑料等行业，同时在石油催化、印刷油墨、聚酯化纤等行业也具有广阔的应用前景。"></p>
                                <p data-i18n="main.home.about_info3" title=" 公司秉持“致力客户成功、指引行业标准”的理念，努力满足客户的需求，新探索、新领域和新产品逐渐成为公司发展的新动力，逐步成为煤系高岭土生产行业的新高地。"></p>
                            </div>
                        </div>
                        <div class="home-right">
                            <video class="home-video" src="https://brightkaolin-official-dev.obs.cn-north-4.myhuaweicloud.com/official/video/video.mp4" width="100%" height="100%" style="object-fit: cover;" loop poster="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/video.png" id="video"></video>
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/home/video_icon.png" class="home-icon video-icon">
                        </div>
                    </div>
                </div>
            </div>
            <!-- 底部 -->
            <div class="footer">
                <!-- bar -->
                <div class="footer-bar"></div>
                <!-- logo -->
                <div class="footer-content">
                    <div class="footer-content-left">
                        <div class="footer-logo">
                            <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/footer/footer_logo.png" class="footer-logo-img" title="logo" alt="logo">
                            <div class="footer-logo-info">
                                <div class="footer-logo-title-zh">山西金宇科林科技有限公司</div>
                                <div class="footer-logo-title-en">Shanxi Bright Kaolin Technology Corp Ltd</div>
                            </div>
                        </div>
                        <div class="footer-desc">
                            <div class="footer-desc-address footer-desc-info">
                                <span data-i18n="footer.address" title="地址"></span>: <span data-i18n="footer.address_info" title="山西省忻州市忻府区兰村乡北场村煤化工循环经济园区"></span>
                            </div>
                            <div class="footer-desc-phone footer-desc-info">
                                <span data-i18n="footer.phone1" title="总机"></span>: <span data-i18n="footer.phone1_info" title="0350-3335888"></span>
                            </div>
                            <div class="footer-desc-phone footer-desc-info">
                                <span data-i18n="footer.phone2" title="销售"></span>: <span data-i18n="footer.phone2_info" title="0350-3335899"></span>
                                <span style="margin-left: 0.08rem" data-i18n="footer.phone3" title="销售"></span>: <span data-i18n="footer.phone3_info" title="0350-3335896"></span>
                            </div>
                        </div>
                    </div>
                    <!-- 内容 -->
                    <div class="footer-content-center">
                        <div class="footer-content-box">
                            <!-- 应用领域 -->
                            <div class="footer-box-item">
                                <div class="footer-box-title">
                                    <a href="#" data-i18n="nav.mainNav.application" title="应用领域"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="application.html?type=1" data-i18n="pages.application_sub_page.paper" title="造纸"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="application.html?type=2" data-i18n="pages.application_sub_page.paints" title="涂料"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="application.html?type=3" data-i18n="pages.application_sub_page.rubber" title="橡胶"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="application.html?type=4" data-i18n="pages.application_sub_page.automotive_paints" title="汽车漆"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="application.html?type=5" data-i18n="pages.application_sub_page.engineering_plastics" title="工程塑料"></a>
                                </div>
                            </div>
                            <!-- 技术中心 -->
                            <div class="footer-box-item">
                                <div class="footer-box-title">
                                    <a href="#" data-i18n="nav.mainNav.technology" title="技术中心"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="technology.html?type=1" data-i18n="pages.technology_sub_page.introduction_center" title="中心介绍"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="technology.html?type=2" data-i18n="pages.technology_sub_page.technology_achievement" title="科技成果"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="technology.html?type=3" data-i18n="pages.technology_sub_page.technology_dynamics" title="技术动态"></a>
                                </div>
                            </div>
                            <!-- 关于我们 -->
                            <div class="footer-box-item">
                                <div class="footer-box-title">
                                    <a href="#" data-i18n="nav.mainNav.about_us" title="关于我们"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="about.html?type=1" data-i18n="pages.about_us_sub_page.company_profile" title="公司简介"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="about.html?type=2" data-i18n="pages.about_us_sub_page.corporate_vision" title="企业愿景"></a>
                                </div>
                            </div>
                            <!-- 新闻中心 -->
                            <div class="footer-box-item">
                                <div class="footer-box-title">
                                    <a href="news.html" data-i18n="nav.mainNav.news" title="新闻中心"></a>
                                </div>
                                <div class="footer-box-sub">
                                    <a href="news.html" data-i18n="footer.news_detail" title="新闻详情"></a>
                                </div>
                            </div>
                            <!-- 联系我们 -->
                            <div class="footer-box-item">
                                <div class="footer-box-title">
                                    <a href="contact.html" data-i18n="nav.mainNav.contact_us" title="联系我们"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 二维码 -->
                    <div class="footer-content-right">
                        <img src="https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/footer/qrcode.png" class="footer-qrcode" title="联系二维码" alt="联系二维码">
                    </div>
                </div>
                <div class="footer-info">
                    <div class="footer-info-box">
                        <span><a href="#">Bright kaolin © 2024</a></span>
                        <span><a href="https://beian.miit.gov.cn/#/Integrated/index">晋ICP备15007529号-1 </a></span>
                        <span><a href="#">晋公网安备14090202000507</a></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 初始加载 -->
    <div class="page-load-loading">
        <div class="loading-wrap">
            <div class="loading-balls">
                <div></div>
                <div></div>
                <div></div>
            </div>
            <div class="loading-title">
                正在加载资源
            </div>
            <div class="loading-sub-title ">
                初次加载资源可能需要较多时间 请耐心等待
            </div>
        </div>
    </div>
</div>
</body>
<script src="js/resize.js"></script>
<script src="api/index.js"></script>
<script src="config/index.js"></script>
<script src="utils/data.js"></script>
<script src="utils/request.js"></script>
<script src="locales/lang/index.js"></script>
<script src="js/home.js"></script>
<script>
    // jquery 导航
    $(document).ready(function () {
        // 页面滚动dom 以及判断距离
        const scrollDom = '.home-content', scrollHeight = 100;

        // 初始加载loading
        setTimeout(() => {
            $('.home-box').css({
                'display': 'block',
            })
            $('.page-load-loading').css({
                'display': 'none',
            })
        }, 100)

        // 高亮导航
        const activeNav = () => {
            $('.nav-logo-img').attr('src', 'https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo_active.png')
            $('.nav-content').css({
                'border-bottom': '0.01rem solid #F1F1F1',
            })
            $('.nav').css({
                'height': 'auto',
                'background': 'hsla(0, 0%, 100%, .8)',
                'box-shadow': '0 0.06rem 0.10rem #0000000f',
                '-webkit-backdrop-filter': 'blur(0.24rem)',
                'backdrop-filter': 'blur(0.24rem)'
            })

            $('.nav-mainNav-item a').css({
                'color': '#000000',
            })
            $('.nav-mainNav-language span').css({
                'color': '#000000',
                'border-color': '#000000'
            })
            $('.nav-sub').css({
                'padding-top': $(scrollDom).scrollTop() < scrollHeight ? '0.24rem' : '0',
            })
        };
        // 还原导航
        const initNav = () => {
            $('.nav-logo-img').attr('src', 'https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo.png')
            $('.nav').css({
                'background-color': $(scrollDom).scrollTop() < scrollHeight ? '#000000' : '#ffffff',
                // 'height': $(scrollDom).scrollTop() < scrollHeight ? '0.92rem' : 'auto',
            })
            $('.nav-content').css({
                'border-bottom':  $(scrollDom).scrollTop() < scrollHeight ? 'none' : '1px solid #F1F1F1',
            })
            $('.nav-mainNav-item a').css({
                'color': $(scrollDom).scrollTop() < scrollHeight ? '#ffffff' : '#000000',
            })
            $('.nav-mainNav-language span').css({
                'color': '#ffffff',
                'border-color': '#ffffff'
            })
            $('.nav-sub').css({
                'padding-top': '0rem',
            })
        };
        // 初始化子节点
        const initSubNav = () => {
            $('.nav-sub-application').css({
                display: 'none',
            })
            $('.mainNav-application').css({
                'border-bottom': '0.02rem solid transparent'
            })
            $('.mainNav-application a').css({
                'color': $(scrollDom).scrollTop() < scrollHeight ? '#ffffff' : '#000000',
            })
            $('.nav-sub-technology').css({
                display: 'none',
            })
            $('.mainNav-technology').css({
                'border-bottom': '0.02rem solid transparent'
            })
            $('.mainNav-technology a').css({
                'color': $(scrollDom).scrollTop() < scrollHeight ? '#ffffff' : '#000000',
            })
            $('.nav-sub-about_us').css({
                display: 'none',
            })
            $('.mainNav-about_us').css({
                'border-bottom': '0.02rem solid transparent'
            })
            $('.mainNav-about_us a').css({
                'color': $(scrollDom).scrollTop() < scrollHeight ? '#ffffff' : '#000000',
            })
            $('.mainNav-news').css({
                'border-bottom': '0.02rem solid transparent'
            })
            $('.mainNav-contact_us').css({
                'border-bottom': '0.02rem solid transparent'
            })
        }

        // 监听页面滚动事件
        $(scrollDom).scroll(_.throttle(function () {
            let scrollTop = $(scrollDom).scrollTop();
            // 判断是否超过100px
            if (scrollTop > scrollHeight) {
                activeNav()
            } else {
                initNav()
            }
        }, 200));

        // 应用领域mouseenter
        $('.mainNav-application').mouseenter((e) => {
            initSubNav()
            activeNav()
            $('.nav-sub-application').css({
                display: 'flex',
            })
            $('.mainNav-application').css({
                'border-bottom': '0.02rem solid #E50012'
            })
            $('.mainNav-application a').css({
                'color': '#E50012',
            })
            $('.nav-sub').css({
                'padding-top': '0.24rem',
            })
        })

        // 技术动态mouseenter
        $('.mainNav-technology').mouseenter((e) => {
            initSubNav()
            activeNav()
            $('.nav-sub-technology').css({
                display: 'flex',
            })
            $('.mainNav-technology').css({
                'border-bottom': '0.02rem solid #E50012'
            })
            $('.mainNav-technology a').css({
                'color': '#E50012',
            })
            $('.nav-sub').css({
                'padding-top': '0.24rem',
            })
        })

        // 关于我们mouseenter
        $('.mainNav-about_us').mouseenter((e) => {
            initSubNav()
            activeNav()
            $('.nav-sub-about_us').css({
                display: 'flex',
            })
            $('.mainNav-about_us').css({
                'border-bottom': '0.02rem solid #E50012'
            })
            $('.mainNav-about_us a').css({
                'color': '#E50012',
            })
            $('.nav-sub').css({
                'padding-top': '0.24rem',
            })
        })

        // 新闻中心mouseenter
        $('.mainNav-news').mouseenter(() => {
            initNav()
            initSubNav()
            $('.mainNav-news a').css({
                'color': '#E50012',
            })
            $('.mainNav-news').css({
                'border-bottom': '0.02rem solid #E50012'
            })
            if ($(scrollDom).scrollTop() > scrollHeight) {
                $('.nav-content').css({
                    'border-bottom': '0.01rem solid #F1F1F1'
                })
                $('.nav').css({
                    'background-color': '#ffffff',
                    'height': 'auto'
                })
                $('.nav-logo-img').attr('src', 'https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo_active.png')
                $('.nav-mainNav-language span').css({
                    'color': '#000000',
                    'border-color': '#000000'
                })
            }
        })

        // 联系我们mouseenter
        $('.mainNav-contact_us').mouseenter(() => {
            initNav()
            initSubNav()
            $('.mainNav-contact_us').css({
                'border-bottom': '0.02rem solid #E50012'
            })
            $('.mainNav-contact_us a').css({
                'color': '#E50012',
            })
            if ($(scrollDom).scrollTop() > scrollHeight) {
                $('.nav-content').css({
                    'border-bottom': '0.01rem solid #F1F1F1'
                })
                $('.mainNav-contact_us').css({
                    'border-bottom': '0.02rem solid #E50012'
                })
                $('.nav').css({
                    'background-color': '#ffffff',
                    'height': 'auto'
                })
                $('.nav-logo-img').attr('src', 'https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo_active.png')
                $('.nav-mainNav-language span').css({
                    'color': '#000000',
                    'border-color': '#000000'
                })
            }
        })

        // 鼠标离开导航栏时候mouseleave
        $('.nav').mouseleave(() => {
            initNav()
            initSubNav()
            if ($(scrollDom).scrollTop() > scrollHeight) {
                $('.nav-logo-img').attr('src', 'https://wanwei-static.obs.cn-north-4.myhuaweicloud.com/brightkaolin-official-web/image/nav/logo_active.png')
                $('.nav-mainNav-language span').css({
                    'color': '#000000',
                    'border-color': '#000000'
                })
            }
        })
        initNav()
    });
</script>
<script>
     // jq页面里面用的
    $(document).ready(function () {
        $('.video-icon').click(() => {
            $('.video-icon').css({
                'display': 'none',
            })
            $('#video').attr('controls', 'true');
            $('#video')[0].play();
        })
        // 如果视频暂停，重新显示自定义播放按钮
        $('#video').on('pause', function() {
            $('#video').attr('controls', 'false');
            $('.video-icon').css({
                'display': 'none',
            })
        });

        // 如果视频结束，重新显示自定义播放按钮
        $('#video').on('ended', function() {
            $('#video').attr('controls', 'false');
            $('.video-icon').css({
                'display': 'block',
            })
        });
        $('.home-1').css('height',$(window).height())
        $('.home-2').css('height',$(window).height())
        $('.home-3').css('height',$(window).height())
        $('.home-4').css('height',$(window).height())
        $('.home-5').css('height',$(window).height())
        $('.home-6').css('height',$(window).height())
        $('.home-7').css('height',$(window).height())
    })

     // 监听窗口大小变化，动态调整
     if (window.addEventListener) {
         window.addEventListener('resize', function () {
             $('.home-1').css('height',$(window).height())
             $('.home-2').css('height',$(window).height())
             $('.home-3').css('height',$(window).height())
             $('.home-4').css('height',$(window).height())
             $('.home-5').css('height',$(window).height())
             $('.home-6').css('height',$(window).height())
             $('.home-7').css('height',$(window).height())
         })
     } else {
         window.attachEvent('onresize', function () {
             $('.home-1').css('height',$(window).height())
             $('.home-2').css('height',$(window).height())
             $('.home-3').css('height',$(window).height())
             $('.home-4').css('height',$(window).height())
             $('.home-5').css('height',$(window).height())
             $('.home-6').css('height',$(window).height())
             $('.home-7').css('height',$(window).height())
         });
     }

</script>
</html>