index.html 13.5 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>首页</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/swiperfour.css">
    <link rel="stylesheet" href="css/common.css">

</head>
<body>

<!--头部导航-->
<nav id="common-nav" class="navbar navbar-inverse navbar-fixed-top">
    <div class="container containerbox">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <div class="toubu">
                <img class="navbar-logo" src="image/logo.png">
            </div>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <div class="nav navbar-nav navbar-right phonelist">
               <div class="phoneimg">
                   <img src="image/phone.png" alt="">
               </div>
                <div class="phonenum">022-89999999</div>
                <div class="shuru">
                    <div class="entershu">
                        <input type="text">
                    </div>
                    <div class="souimg">
                        <img src="image/sousuo.png" alt="">
                    </div>
                </div>
                <div class="qiehuan">EN</div>
            </div>


            <ul class="nav navbar-nav navbar-right navtou">
                <li>
                    <a href="" class="navactive">网站首页</a>
                </li>

                <li>
                    <a href="">
                        公司介绍
                    </a>

                </li>
                <li>
                    <a href="" >
                        产品系列

                    </a>
                </li>
                <li>
                    <a href="">
                        主要服务
                    </a>
                </li>
                <li>
                    <a href="">
                        资料下载

                    </a>
                </li>

                <li>
                    <a href="">
                        联系我们
                    </a>
                </li>





            </ul>
        </div><!-- /.navbar-collapse -->


    </div><!-- /.container-fluid -->
</nav>
<div class="swiper-container" >
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <img src="image/banner.png" alt="">
<!--            <div class="seenow">立即查看></div>-->
        </div>
        <div class="swiper-slide">
            <img src="image/banner.png" alt="">
<!--            <div class="seenow">立即查看></div>-->
        </div>
        <div class="swiper-slide">
            <img src="image/banner.png" alt="">
<!--            <div class="seenow">立即查看></div>-->
        </div>
    </div>
    <div class="swiper-pagination"></div><!--分页器。如果放置在swiper-container外面,需要自定义样式。-->


</div>
<!--    关于我们-->
<div class="womencontainer">
    <div class="container">

        <div class="row aboutwomen">
            <div class="col-md-5 col-sm-12">
                <div class="beyellow">
                    <div class="beiimg">
                        <img src="image/beijing.png" alt="">
                    </div>
                </div>
            </div>
            <div class="col-md-5 col-sm-12 guanyuwomenzi">
                <div class="guanyuour">
                    <div class="guanyuourtop">ABOUT US</div>
                    <div class="guanyuourbottom">关于我们</div>
                </div>

                <div class="introtext">
                    天津小黄人智能科技有限公司是一家以工业自动化产品维修、
                    销售的高新科技企业,拥有专业发那科维修设备,完善的产品
                    检测设备和强大的售后团队。主要经营发那科设备检测平台搭建,
                    开通功能,发那科设备快修保养及销售,主要经营包括: 交流伺服
                    放大器、伺器电源、伺服电机、主轴电机、 编码器、手摇脉冲发生器
                    、 控制板,MDI 单元、操作面板、触摸屏等产品。
                    天津小黄人智能科技有限公司是一家以工业自动化产品维修、
                    销售的高新科技企

                </div>

                <div class="seegengduo">查看更多>></div>
            </div>
        </div>
    </div>
</div>

<!--我们的产品-->
<div class="ourproduct">
    <div class="container">
        <div class="proname">
            <div class="pronametop">our product</div>
            <div class="pronamebottom">我们的产品</div>
        </div>
        <div class="row pronum">
            <div class="col-md-4">
                <div class="protoppic">
                    <img src="image/xitong.png" alt="">
                </div>
                <div class="propicbottom">
                    <div class="propicname">
                        系统
                    </div>
                    <div class="propictext">0i系统、18i-21i系统、31i-32i系统、显示器</div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="protoppic">
                    <img src="image/dianji.png" alt="">
                </div>
                <div class="propicbottom">
                    <div class="propicname">
                        电机
                    </div>
                    <div class="propictext">主轴电机、伺服电机</div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="protoppic">
                    <img src="image/qudongqi.png" alt="">
                </div>
                <div class="propicbottom">
                    <div class="propicname">
                        驱动器
                    </div>
                    <div class="propictext">电源驱动、主轴驱动、伺服驱动、一体化驱动</div>
                </div>
            </div>
        </div>
    </div>

</div>

<!--我们的优势-->
<div class="ouradvantage">
    <div class="zhuanyetitle">
        <div class="zhuanyetitlename">our advantages</div>
        <div class="zhuanyetitletext">我们的优势</div>
    </div>
    <div class="neiadvantage">
        <div class="container youshinei">

            <div class="row">
                <div class="col-md-4 col-sm-12 youshiitem">
                    <div class="uoushitop">
                        <img src="image/tuandui.png" alt="">
                    </div>
                    <div class="zhuanyename">专业的维修团队</div>
                    <div class="zhuantetext">基值支义们京候么眼革下使叫。南石很样好清少去准连究志议构。
                        调研而手开求况做体式达高心置过。装切此报列明子马世志再部增心。</div>
                </div>
                <div class="col-md-4 col-sm-12 youshiitem">
                    <div class="uoushitop">
                        <img src="image/tuandui.png" alt="">
                    </div>
                    <div class="zhuanyename">完善的产品检测设备</div>
                    <div class="zhuantetext">基值支义们京候么眼革下使叫。
                        南石很样好清少去准连究志议构。调研而手开求况做体式达高心置过。
                        装切此报列明子马世志再部增心。</div>
                </div>
                <div class="col-md-4 col-sm-12 youshiitem">
                    <div class="uoushitop">
                        <img src="image/tuandui.png" alt="">
                    </div>
                    <div class="zhuanyename">维修周期短质量高</div>
                    <div class="zhuantetext">基值支义们京候么眼革下使叫。
                        南石很样好清少去准连究志议构。调研而手开求况做体式达高心置过。
                        装切此报列明子马世志再部增心。</div>
                </div>

            </div>
        </div>
    </div>
</div>

<!--我们的宗旨-->
<div class="zongzhi">

    <div class="zongzhitop">
        <div class="zongzhitext">
            本公司本着“诚信服务、合理价格”的宗旨
            为新老客户提供优质服务
        </div>
        <div class="huanghengxian"></div>
        <div class="shuomingbox">
            <div class="shuomingboxtop">公司拥有专业的维修团队,经验丰富。</div>
            <div class="shuomingboxtop">从技术咨询、到现场故障诊断,都可以提供专业服务,维修周期短、修复质量高、及时解决问题。</div>
            <div class="shuomingboxtop">本公司备有大量现货,价格优惠,交货快捷, 质量可靠。</div>
            <div class="shuomingboxtop">为企业节省了大量的资金,缩短了停产周期,提高了工作效率,在用户中树立了良好的口碑。</div>
        </div>

    </div>


</div>

<!--联系我们-->
<div class="connectus">
    <div class="connectopbox">
        <div class="connectustop">contact us</div>
        <div class="connectusname">联系我们</div>
    </div>

    <div class="connectmap">
        <div id="container" ></div>

    </div>
    <div class="connectlist">
        <div class="container">
            <div class="row">
                <div class="col-md-2  listitem">
                    <div class="connectlistitem">
                        <div class="connectitemimg">
                            <img src="image/address.png" alt="">
                        </div>
                        <div class="addressname">天津市西青区华科大街1号</div>
                    </div>
                </div>
                <div class="col-md-2  listitem">
                    <div class="connectlistitem">
                        <div class="connectitemimg">
                            <img src="image/dianhua.png" alt="">
                        </div>
                        <div class="addressname">18888888888</div>
                    </div>
                </div>
                <div class="col-md-2  listitem">
                    <div class="connectlistitem">
                        <div class="connectitemimg">
                            <img src="image/pingban.png" alt="">
                        </div>
                        <div class="addressname">15688888888</div>
                    </div>
                </div>
                <div class="col-md-2  listitem">
                    <div class="connectlistitem">
                        <div class="connectitemimg">
                            <img src="image/weixin.png" alt="">
                        </div>
                        <div class="addressname">15688888888</div>
                    </div>
                </div>
                <div class="col-md-2  listitem">
                    <div class="connectlistitem">
                        <div class="connectitemimg">
                            <img src="image/xinxi.png" alt="">
                        </div>
                        <div class="addressname">88888888@163.com</div>
                    </div>
                </div>


            </div>
        </div>
    </div>

</div>

<!--底部信息-->
<div class="footer">
    <ul class="footertop">
        <li class="gsjs">公司介绍</li>
        <li  class="gsjs">产品系列</li>
        <li  class="gsjs">主要服务</li>
        <li >联系我们</li>
    </ul>
    <div class="footerbottom">小黄人智能科技有限公司主营:高速电机、同步伺服电机、大功率伺服电机、异步伺服电机等,质量可靠,价格公道,欢迎选购。沪公网安备 31011202006407号</div>
</div>

<!--客服-->
<div class="kefubox">
    <div class="kefutop">
        <img src="image/kefu.png" alt="">
    </div>
    <div class="kefutop dingbu">
        <img src="image/top.png" alt="">
    </div>
</div>



</body>
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/swiperfour.min.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key=735d888fa7a9599eea4de210edc32335"></script>
<script>

    <!--    页面返回到顶部-->

    $('.dingbu').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});


    var mySwiper = new Swiper ('.swiper-container', {

        loop: true,
        // autoplay:true,

        // duration:1000,
        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
        },


    })

    $("a").mouseenter(function(){
        console.log(9999)
        $(this).addClass("navactive");
        $(this).parents("li").siblings("li").children("a").removeClass("navactive")
    })




    var map = new AMap.Map('container', {
        resizeEnable: true,
        center:[116.480983, 39.989628],
        zoom:11
    });
    AMap.plugin('AMap.ToolBar',function(){
        var toolbar = new AMap.ToolBar();
        map.addControl(toolbar)
    })

</script>

</html>