| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402 | <!DOCTYPE html><html>	<head>		<meta charset="UTF-8">		<meta name="viewport" content="width=1360,user-scalable=yes" />     		<meta name="apple-mobile-web-app-capable" content="yes">		<meta name="apple-mobile-web-app-status-bar-style" content="black">		<meta http-equiv="Content-Type" content="text/html;charset=utf-8">		<meta http-equiv="Content-Language" content="zh-CN">		<meta name="keywords" content="">		<meta name="description" content="">		<title>Aiberle</title>		<link href="favicon.ico" rel="shortcut icon">		<link rel="stylesheet" href="../css/main.css" />		<style type="text/css">			/* css 重置 */						* {				margin: 0;				padding: 0;				list-style: none;			}						body {				background: #fff;			}						img {				border: 0;			}						a {				text-decoration: none;				color: #333;			}						a:hover {				color: #1974A1;			}						.js {				width: 90%;				margin: 10px auto 0 auto;			}						.js p {				padding: 5px 0;				font-weight: bold;				overflow: hidden;			}						.js p span {				float: right;			}						.js p span a {				color: #f00;				text-decoration: underline;			}						.js textarea {				height: 100px;				width: 98%;				padding: 5px;				border: 1px solid #ccc;				border-top: 2px solid #aaa;				border-left: 2px solid #aaa;			}			/* 本例子css */						#ifocus {				min-width: 1080px;				max-width: 1500px;				margin-bottom: 7px;				height: 522px;				border: 0;				background: #f8f6f4;			}						#ifocus_pic {				display: inline;				position: relative;				float: right;				width: 1500px;				height: auto;				overflow: hidden;			}						#ifocus_piclist li {				width: 100%;				height: auto;				overflow: hidden;			}						#ifocus_piclist img {				width: 100%;				height: auto;			}						#ifocus_btn {				display: inline;				position: absolute;				left: 100px;				top: 70px;				margin-top: 9px;				width: 100px;				padding-right: 5px;			}						#ifocus_btn li {				width: 100px;				height: 100px;				overflow: hidden;				text-align: center;				margin-bottom: 35px;				border: 1px solid #ccc\9;				border: 1px solid rgba(0, 0, 0, .2);				cursor: pointer;				opacity: 0.5;				-moz-opacity: 0.5;				filter: alpha(opacity=50);			}						#ifocus_btn img {				width: auto;				height: 100px;			}						#ifocus_btn .on {				opacity: 1;				-moz-opacity: 1;				filter: alpha(opacity=100);			}						#ifocus_opdiv {				position: absolute;				left: 0;				bottom: 0;				width: 340px;				height: 35px;				background: #000;				opacity: 0.5;				-moz-opacity: 0.5;				filter: alpha(opacity=50);			}						#ifocus_tx {				position: absolute;				left: 8px;				bottom: 8px;				color: #FFF;			}						#ifocus_tx ul li {				display: none;			}						#ifocus_tx ul li a {				color: #fff;				font-size: 14px;				font-weight: bold;			}		</style>	</head>	<body>		<div class="header">			<a href="index.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/logo.png" /></a>			<a class="icon-language" name="en-us"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/en-us.png" /></a>		</div>		<div class="nav-top-bar-box">				<div class="menu-list-1">			<div>			<div class="list-cell">			<a href="understanding_brands.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-1.jpg"/><span>了解品牌</span></a>			<a href="brand_story.html" style="display: none;"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-2.jpg"/><span>品牌故事</span></a>			<a href="development_history.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-3.jpg"/><span>发展历程</span></a>			<a href="enterprise_dynamics.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-4.jpg"/><span>企业动态</span></a>			</div>			</div>		</div>		<div class="menu-list-3">			<div>			<div class="list-cell">			<a href="pro_aiberle.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-9.jpg"/><span>冲奶机</span></a>			<a href="//item.jd.com/27532285015.html"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/menu-list-10.jpg"/><span>孕产妇电动牙刷</span></a>			</div>			</div>		</div>		<div class="menu-list-4">				<div>					<div class="list-cell">						<a href="pro_aiberle2.html"><img src="images/menu-list-5.jpg" /><span>美容软水机</span></a>						<a href="pro_aiberle3.html"><img src="images/menu-list-6.jpg" /><span>净水龙头</span></a>						<a href="pro_aiberle1.html"><img src="images/menu-list-7.jpg" /><span>净水花洒</span></a>					</div>				</div>			</div>			<div class="nav-top-bar">				<a class="li menu-1">探索爱贝源</a>				<a href="pro_water.html">桌面净水机</a>				<a class="li menu-4">生活净水</a>				<a class="li menu-3">其他产品</a>			</div>		</div>		<div class="main-content" id="index" style="display: block;"> <!-- Swiper -->  <div class="video-box1">				  <!-- Swiper --><div id="ifocus" style="margin:0 auto">					<div id="ifocus_pic">						<div id="ifocus_piclist">							<ul>								<li>									<a><img class="first" src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-14.png" /></a>								</li>								<li>									<a><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-15.png" /></a>								</li>								<li>									<a><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-16.png" /></a>								</li>							</ul>						</div>					</div>					<div id="ifocus_btn">						<ul>							<li><img class="first" src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-14-small.png"></li>							<li><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-15-small.png"></li>							<li><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-16-small.png"></li>						</ul>					</div>					<div class="cl-box"><div>	<ul class="color-list" style="display: none;">		<li name="1" src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-14.png" smallSrc="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-14-small.png" class="color-cell-1 active"></li>	</ul></div></div>				</div>				    <!--<div class="swiper-container swiper-container6 gallery-top">    <div class="swiper-wrapper">      <div class="swiper-slide wrapper1"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-1.png" /></div>      <div class="swiper-slide"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-5.png" /></div>      <div class="swiper-slide"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-6.png" /></div>    </div>    <div class="swiper-button-next swiper-button-white"></div>    <div class="swiper-button-prev swiper-button-white"></div>  </div>  <div class="swiper-container gallery-thumbs" style="-webkit-transform: rotate(90deg);transform: rotate(90deg);position: absolute;left:-5%;top:45%;width: 450px;">    <div class="swiper-wrapper">      <div name="0" class="swiper-slide slide0" style="width: 90px;height: 90px;background: url(//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-1.png) center center no-repeat;background-size: auto 100%;margin-right: 15px; -webkit-transform: rotate(-90deg);transform: rotate(-90deg);border: 1px solid rgba(0,0,0,.2);"></div>      <div name="1" class="swiper-slide slide1" style="width: 90px;height: 90px;background: url(//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-5.png) center center no-repeat;background-size: auto 100%;margin-right: 15px;-webkit-transform: rotate(-90deg);transform: rotate(-90deg);border: 1px solid rgba(0,0,0,.2);"></div>      <div name="2" class="swiper-slide slide2" style="width: 90px;height: 90px;background: url(//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-6.png) center center no-repeat;background-size: auto 100%;margin-right: 15px;-webkit-transform: rotate(-90deg);transform: rotate(-90deg);border: 1px solid rgba(0,0,0,.2);"></div>    </div>  </div>--><div class="pro-title">	<img src="//s.iamberry.com/aiberle/www/zh-cn/images/chanpin-title3.png" /></div></div>						<div class="fixed-nav-box">			<div class="fixed-nav">				<div class="nav-left-fixed">				<div class="nav-li">				<div class="li-img">					<img src="//s.iamberry.com/aiberle/www/zh-cn/images/ruanshuiyi-icon.png" />				</div>				<span class="li-tit">XL-Ai-N01</span>				</div>				</div>				<div class="pro-nav">					<a href="#jieshao">						产品介绍					</a>					<a href="#quyulu">						特性					</a>					<a href="#canshu">						参数					</a>					<a style="color:#f43216;" href="//item.jd.com/29553875184.html" target="_blank">						京东购买					</a>				</div>			</div>		</div>		<div>			<div class="nav-sys" id="jieshao">				<div>					<a href="#quyulu"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/icon-menu-10.png" /><span>深层清洁</span></a>				</div>				<div>					<a href="#quyulu"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/icon-menu-11.png" /><span>告别干燥</span></a>				</div>				<div>					<a href="#jingshui"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/icon-menu-12.png" /><span>水质保湿</span></a>				</div>			</div>		</div>		<div class="content-list">			<div id="quyulu" style="margin-top: 0;"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-24.jpg" /></div>			<div ><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-25.jpg" /></div>			<div ><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-26.jpg" /></div>			<div id="jingshui"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-27.jpg" /></div>			<div ><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-28.jpg" /></div>			<div id="canshu"><img src="//s.iamberry.com/aiberle/www/zh-cn/images/detail-29.jpg" /></div>		</div>		</div>				<div class="footer">	<div class="footer-box">		<ul class="footer-list">			<li>				<ul class="footer-cell">					<li>探索Aiberle</li>					<li><a href="understanding_brands.html">了解品牌</a></li>					<li style="display: none;"><a href="brand_story.html">品牌故事</a></li>					<li><a href="development_history.html">发展历程</a></li>					<li><a href="enterprise_dynamics.html">企业动态</a></li>				</ul>			</li>			<li>				<ul class="footer-cell">							<li>产品</li>							<li>								<a href="pro_water.html">桌面净水机</a>							</li>							<li>								<a href="pro_aiberle2.html">美容软水机</a>							</li>							<li>								<a href="pro_aiberle3.html">净水龙头</a>							</li>							<li>								<a href="pro_aiberle1.html">净水花洒</a>							</li>							<li>								<a href="pro_aiberle.html">冲奶机</a>							</li>							<li>								<a href="//item.jd.com/27532285015.html">孕产妇电动牙刷</a>							</li>						</ul>			</li>			<li>				<ul class="footer-cell">					<li>关注Aiberle</li>					<li>电话:400 800 6692</li>					<li>邮箱:aiberle@iamberry.com</li>					<li>								Aiberle全球营销总部:深圳爱贝源科技有限公司								<!--<span class="icon icon-wx"></span>-->								<!--<span class="icon icon-jd"></span>-->							</li>							<li>								Aiberle全球营销总部地址:广东省深圳市福田区特区报业大厦12B							</li>				</ul>			</li>		</ul>	<div class="footer-bottom">		Copyright © 2016-2018 aiberle Corporation, All Rights Reserved<br />		深圳爱贝源科技有限公司 版权所有<br />		<a href="http://www.miitbeian.gov.cn/">粤ICP备16023001号-1</a>	<div class="show_wechat">		<img src="//s.iamberry.com/aiberle/www/zh-cn/images/code-2wm.png" />		<div>扫描二维码</div>		<div>关注Aiberle官方微信</div>	</div>	</div></div>	<script type="text/javascript" src="//s.iamberry.com/aiberle/www/zh-cn/js/jquery-1.11.1.min.js" ></script><script type="text/javascript" src="//s.iamberry.com/aiberle/www/zh-cn/js/jquery.mousewheel.min.js"></script><script type="text/javascript" src="//s.iamberry.com/aiberle/www/zh-cn/js/jquery.SuperSlide.2.1.1.js"></script><script type="text/javascript" src="//s.iamberry.com/aiberle/www/zh-cn/js/main.js"></script><script>$(function() {	$("#ifocus").slide({		titCell: "#ifocus_btn li",		mainCell: "#ifocus_piclist ul",		effect: "top",		delayTime: 700,		autoPlay: false,		triggerTime: 0	});});$(document).on('mouseover', '.color-list>li', function() {   $("#ifocus_pic .first").attr("src", $(this).attr("src"));	$("#ifocus_btn .first").attr("src", $(this).attr("smallSrc"));	$(this).addClass("active").siblings().removeClass("active");});</script></body></html>
 |