<!DOCTYPE html>
<html lang="en">

<head>
    <!-- H5 header -->
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <title>铭峪游戏平台</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" type="text/css" href="./js/vendor/cropper/cropper.min.css" />
    <link rel="stylesheet" type="text/css" href="./js/vendor/cropper/ImgCropping.css" />
    <link rel="stylesheet" href="./js/vendor/dropload/css/dropload.css">
    <link rel="stylesheet" href="./js/vendor/swiper-4.4.1/css/swiper.min.css">

    <!-- 自定义css样式 -->
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/foot.css">
    <link rel="stylesheet" href="./css/index.css">

    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
    <!-- 外部插件 -->
    <script type="text/javascript" src="./js/vendor/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="./js/vendor/cropper/cropper.min.js"></script>
    <script type="text/javascript" src="./js/vendor/swiper-4.2.2/dist/js/swiper.min.js"></script> <!-- 轮播图js -->
    <script type="text/javascript" src="./js/layer/layer.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="navigation">
        <div class="navigation-child">
            <div class="navigation-logo" onload="location.reload();"></div>
            <ul class="navigation-menu">
                <li class="navigation-index navigation-menu-selected"><a href="index.html">首页</a></li>
                <li class="navigation-gift"><a href="game.html">产品中心</a></li>
                <li class="navigation-pay"><a href="pay.html">充值中心</a></li>
                <li class="navigation-pay"><a href="service.html">客服中心</a></li>
            </ul>
        </div>
    </div>

    <div class="home-banner">
        <!-- style="height:750px;" -->
        <div class="swiper-container" id="home-slider">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="javascript:;" data-type="1">
                        <img src="images/home/slider1.jpg?v=1" alt="">
                    </a>
                </div>
                <!-- <div class="swiper-slide">
                    <a href="javascript:;" data-type="2">
                        <img src="images/home/slider2.jpg" alt="">
                    </a>
                </div> -->
            </div>
            <div class="swiper-pagination"></div>
            <!-- <div class="swiper-button-prev"></div> -->
            <!--左箭头。如果放置在swiper-container外面，需要自定义样式。-->
            <!-- <div class="swiper-button-next"></div> -->
            <!--右箭头。如果放置在swiper-container外面，需要自定义样式。-->
        </div>
    </div>

    <div class="pc-content-title">
        <span>我们的<span class="title-blue">游戏</span>GAMES</span>
    </div>
    <div class="pc-home-game">
        <div class="home-game-swiper">
            <div class="swiper-container" id="slider-game">
                <div class="swiper-wrapper">
                    <!-- <div class="swiper-slide">
                        <div class="pc-game-background"><img src="./images/home/game-slider2.jpg" alt="">
                        </div>
                        <div class="pc-game-bottom">
                            <div class="pc-game-logo">
                                <div><img src="./images/home/logo2.png" alt=""></div><span>战神崛起</span>
                            </div>
                            <div class="game-introduce">
                                独家打造传奇类H5游戏，在延续了原版传奇的基础上，升级了跨服PK、野外BOSS、万人攻杀等原汁原味的经典玩法，百分百还原千人同屏爆装激情，为您带来酣畅淋漓的全新体验！
                            </div><a href="game.html" class="pc-content-more">了解更多</a>
                        </div>
                    </div> -->
                    <div class="swiper-slide">
                        <div class="pc-game-background"><img src="./images/home/game-slider1.jpg" alt="">
                        </div>
                        <div class="pc-game-bottom">
                            <div class="pc-game-logo">
                                <div><img src="./images/home/logo1.png" alt=""></div><span>加法天才</span>
                            </div>
                            <div class="game-introduce">
                                《加法天才》游戏一款高度还原美轮美奂的仙境之地，玩家即刻踏上冒险之旅。
                            </div><a href="game.html" class="pc-content-more">了解更多</a>
                        </div>
                    </div>
                </div>

                <div class="swiper-pagination"></div>
            </div>
        </div>
    </div>


    <!-- 页脚 -->
    <div class="pc-foot">
        <div class="pc-foot-link">
            <a href="index.html">首页</a>
            <a href="game.html">产品中心</a>
            <a href="pay.html">充值中心</a>
            <a href="service.html">客服中心</a>
        </div>
        <div class="pc-foot-content">
            <a href="//www.dahuowang.cn/" target="_blank" class="pc-foot-logo">
                <img src="./images/logo.png" alt="">
            </a>
            <div class="pc-foot-letter">
                <p><span>上海铭峪网络科技有限公司 版权所有</span><span>Shanghai Mingyu Network Technology Co., Ltd</span></p>
                <p><span>网站备案号：<a href="http://beian.miit.gov.cn" target="_blank">沪ICP备2021030483号</a></span>
                    <span>增值电信业务经营许可证：沪ICP备2021030483号-1 </span>
                </p>
            </div>
        </div>

        <div class="pc-foot-pipe">
            <a target="_blank" href="http://scjgj.sh.gov.cn/">
                <img src="./images/foot/icon65.jpg" alt="">
                <i>
                    <p>上海市工商行政管理局</p>
                </i>
            </a>
            <a target="_blank" href="http://www.shjbzx.cn/">
                <img src="./images/foot/icon43.png"><i>
                    <p>上海市互联网违法和</p>
                    <p>不良信息举报中心</p>
                </i></a>
            <!-- <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo"><img
                    src="./images/foot/icon38.png"><i>
                    <p>沪公安网备标识</p>
                    <p>33018502001980</p>
                </i></a> -->
        </div>

        <div class="foot-content-look">
            <span>抵制不良游戏</span>
            <span>拒绝盗版游戏</span>
            <span>注意自我保护</span>
            <span>谨防受骗上当</span>
            <span>适度游戏益脑</span>
            <span>沉迷游戏伤身</span>
            <span>合理安排时间</span>
            <span>享受健康生活</span>
        </div>
        <div class="foot-bottom"></div>
    </div>

    <script type="text/javascript" src="./js/www/public.js"></script>
    <script type="text/javascript" src="./js/www/home.js"></script>
    <script>
        var gameSwiper = new Swiper('#home-slider', {
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
                renderBullet: function (index, className) {
                    return '<span class="' + className + '"></span>';
                },
            },
            autoplay: {
                delay: 3000, //1秒切换一次
                stopOnLastSlide: false,
                disableOnInteraction: false,
            },
            // navigation: {
            //     nextEl: '.swiper-button-next',
            //     prevEl: '.swiper-button-prev',
            // },
        });
        /* 首页轮播图 鼠标进入 */
        $('#home-slider .swiper-slide').hover(function () {
            gameSwiper.autoplay.stop();
        }, function () {
            gameSwiper.autoplay.start();
        });

        var weGameSwiper = new Swiper('#slider-game', {
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
                renderBullet: function (index, className) {
                    return '<span class="' + className + '"></span>';
                },
            },
            autoplay: {
                delay: 3000, //1秒切换一次
                stopOnLastSlide: false,
                disableOnInteraction: false,
            },
            // navigation: {
            //     nextEl: '.swiper-button-next',
            //     prevEl: '.swiper-button-prev',
            // },
        });
        /* 首页轮播图 鼠标进入 */
        $('#slider-game .swiper-slide').hover(function () {
            weGameSwiper.autoplay.stop();
        }, function () {
            weGameSwiper.autoplay.start();
        });
    </script>
</body>