jsasg/orico-official-website-old
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
jsasg
2024-10-29 14:04:59 +08:00
commit 48bf3e6f33
2839 changed files with 762707 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

616
public/frontend/web/详情.shtml Executable file
View File

@@ -0,0 +1,616 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--#include file="include/head.html" -->
<!-- <script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script> -->
<script type="text/javascript" src="scripts/jquery.jqzoom.js"></script>
<script type="text/javascript" src="scripts/large.js"></script>
<script type="text/javascript">
var navID = "1";
</script>
</head>
<body>
<!--top-->
<!--#include file="include/top.html" -->
<!--top End-->
<div class="indexbox4 cpmbox">
<div class="w1440">
<!-- 产品 s -->
<div class="cp outBox">
<div class="cpfl">
<!--preview start-->
<div class="preview">
<div class="smallImg">
<div class="scrollbutton smallImgUp disabled"></div>
<div id="imageMenu">
<ul>
<li id="onlickImg"><img src="small/01.jpg" width="80" height="100"/></li>
<li><img src="small/02.jpg" width="80" height="100" /></li>
<li><img src="small/03.jpg" width="80" height="100" /></li>
<li><img src="small/04.jpg" width="80" height="100" /></li>
<li><img src="small/05.jpg" width="80" height="100" "/></li>
<li><img src="small/06.jpg" width="80" height="100" "/></li>
</ul>
</div>
<div class="scrollbutton smallImgDown"></div>
</div><!--smallImg end-->
<div id="vertical" class="bigImg">
<img src="mid/01.jpg" width="442" height="535" alt="" id="midimg" />
<div style="display:none;" id="winSelector"></div>
</div><!--bigImg end-->
<div id="bigView" style="display:none;"><img width="800" height="800" alt="" src="" /></div>
</div>
<!--preview end-->
<!-- phone s-->
<div class="swiper-container banners">
<div class="swiper-wrapper">
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/cp.jpg"></a></div>
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/cp.jpg"></a></div>
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/cp.jpg"></a></div>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination bandot"></div>
</div>
<!-- 视频播放 s -->
<div class="play">
<a href="javascript:;" class="pcha"><img src="images/images/cha1.png"></a>
<div class="moimg"><img src="images/images/mo.jpg"></div>
</div>
<div class="plbtn"><a href="javascript:;"><img src="images/images/play.png"></a></div>
<!-- 视频播放 e -->
<script>
var swiper = new Swiper('.banners', {
loop: true,
autoplay:true,
pagination:{
el: '.bandot',
},
});
$(function(){
$(".plbtn").click(function(){
$(".play").show();
})
$(".pcha").click(function(){
$(".play").hide();
})
})
</script>
<!-- phone e -->
</div>
<div class="cprh">
<div class="cpcon">
<p class="ctit1">ORICO <span>L12000</span> Scharge聚合物移动电源</p>
<p class="ctit2">2000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<ul class="cpul">
<li><i></i>ABS （边框亮面，表面纹面处理）</li>
<li><i></i>12000mAh轻巧大容量</li>
<li><i></i>A+级聚合物电芯，为了安全</li>
<li><i></i>柔光小夜灯，让夜晚尽在“掌握</li>
</ul>
<div class="hd">
<ul>
<li class="on"><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
<span>颜色</span>
</div>
<div class="buy">
<a href="#">购买天猫</a>
<a href="#">购买京东</a>
</div>
</div>
<div class="clear"></div>
<script type="text/javascript">
// jQuery(".inBox").slide({ titCell:".inHd li",mainCell:".inBd"});
// jQuery(".outBox").slide({trigger:"click"});
// $(document).ready(function(){
// $('#example1').sliderPro({
// width: 442,
// height: 520,
// orientation: 'vertical',
// autoplay:false,
// loop: false,
// arrows: true,
// buttons: false,
// thumbnailsPosition: 'right',
// thumbnailPointer: true,
// thumbnailWidth: 80,
// thumbnailHeight:100,
// breakpoints:{
// 800: {
// },
// 500: {
// },
// 320: {
// width:300,
// height:320,
// }
// }
// });
// });
</script>
</div>
<!-- 产品 e -->
</div>
</div>
<div class="warp">
<div class="warpa">
<!-- 锚链接 s -->
<ul class="w1440 cpa">
<li><a href="#link1">亮点</a></li>
<li><a href="#link2">相关</a></li>
<li><a href="#link3">评论</a></li>
<li><a href="#link4">规格</a></li>
<li><a href="#link5">下载</a></li>
<li><a href="#link6">常见问题</a></li>
<div class="clear"></div>
</ul>
<!-- 锚链接 e -->
</div>
<!-- 亮点 s-->
<div class="warp1 proTfg">
<div class="w1440">
<div class="light">
<div class="lgtit" id="link1">亮点</div>
<div class="lgimg"><img src="uploadfiles/image/pban.jpg"></div>
<div class="lgfl"><img src="uploadfiles/image/pin1.jpg"></div>
<div class="lgrh">
<p class="lgtext">ORICO L12000 Scharge聚合物移动电源</p>
<p>12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
<p>12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 </p>
<ul class="lgul">
<li><i></i>卖点一卖点一卖点一卖点一卖点一卖点一卖点一</li>
<li><i></i>卖点二卖点二卖点二卖点二卖点二卖点二卖点二卖点二</li>
<li><i></i>卖点三卖点三卖点三卖点三卖点三卖点三卖点三卖点三卖点三卖点三</li>
</ul>
</div>
<div class="clear"></div>
<ul class="cplist">
<li>
<img src="uploadfiles/image/pin2.jpg">
<p class="lg1">ORICO L12000 Scharge聚合物移动电源</p>
<p class="lg2">12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 </p>
</li>
<li>
<img src="uploadfiles/image/pin3.jpg">
<p class="lg1">ORICO L12000 Scharge聚合物移动电源</p>
<p class="lg2">12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 </p>
</li>
<div class="clear"></div>
</ul>
<ul class="msul">
<div class="mstit">产品描述</div>
<li>
<p class="ms1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="ms2">ORICO L12000 Scharge聚合物移动电源</p>
</li>
<li>
<p class="ms1">产品材质: ABS （边框亮面，表面纹面处理</p>
<p class="ms2">型号：ORICO L12000</p>
</li>
<li>
<p class="ms1">产品颜色: </p>
<p class="ms2">白</p>
</li>
<li>
<p class="ms1">产品容量: </p>
<p class="ms2">12000mAh</p>
</li>
<li>
<p class="ms1">产品电芯:</p>
<p class="ms2">聚合物</p>
</li>
</ul>
</div>
<!-- 亮点 e-->
</div>
</div>
<!-- 亮点 e-->
<!-- 关联产品 s -->
<div class="warp2 proTfg"">
<div class="w1440">
<div class="gltit" id="link2">关联产品</div>
<div class="cpBox">
<div class="owl-carousel">
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp1.png"></div>
<div class="gltext">
<p class="gl1">安卓充电数据线</p>
<p class="gl2">ORICO BTM-10</p>
</div>
<div class="clear"></div>
</a>
</div>
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp2.png"></div>
<div class="gltext">
<p class="gl1">新国标桌面智能排插</p>
<p class="gl2">ORICO EPC-2A3U</p>
</div>
<div class="clear"></div>
</a>
</div>
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp3.png"></div>
<div class="gltext">
<p class="gl1">QC3.0车载充电器</p>
<p class="gl2">ORICO UCH-Q3</p>
</div>
<div class="clear"></div>
</a>
</div>
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp4.png"></div>
<div class="gltext">
<p class="gl1">迷你口袋蓝牙音箱</p>
<p class="gl2">ORICO BS16 </p>
</div>
<div class="clear"></div>
</a>
</div>
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp1.png"></div>
<div class="gltext">
<p class="gl1">QC3.0车载充电器</p>
<p class="gl2">ORICO UCH-Q3</p>
</div>
<div class="clear"></div>
</a>
</div>
<div class="item wow">
<a href="#">
<div class="glimg"><img src="uploadfiles/image/sp2.png"></div>
<div class="gltext">
<p class="gl1">迷你口袋蓝牙音箱</p>
<p class="gl2">ORICO BS16 </p>
</div>
<div class="clear"></div>
</a>
</div>
</div>
<script>
var owl = $(".cpBox .owl-carousel");
owl.owlCarousel({
autoplay:true,
navigationText: ["",""],
responsive:{
0:{
items:1,
margin:0
},
640:{
items:2,
margin:0,
smartSpeed:80,
dots:false
},
998:{
items:4,
margin:0,
smartSpeed:80,
dots:false
},
},
})
</script>
</div>
</div>
</div>
<!-- 关联产品 e -->
<!-- 评论 s -->
<div class="nybox proTfg">
<div class="w1440">
<div class="pltitle">
<p class="pltit" id="link3">评论</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
</p>
<p class="pltit1">128条评论</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<div class="plcon">
<p class="py1">标题：ORICO L12000 Scharge聚合物移动电源</p>
<p class="plimg">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x1.png">
<img src="images/x2.png">
<span>4</span>
</p>
<p class="py2">2018-08-28</p>
<p class="py3">评价内容12000mAh移动电源 LCD屏高精度显示电量 A+级聚合物安全电芯 智能快充</p>
</div>
<!-- 分页 s -->
<div class="Pages" style="margin-top:20px;">
<span class="p_page">
<a href="javascript:void(0);" class="a_prev"></a>
<em class="num">
<a href="#" class="a_cur">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>
<span>...</span>
<a href="#">126</a>
</em>
<a href="javascript:void(0);" class="a_next"></a>
</span>
</div>
<!-- 分页 e -->
</div>
</div>
<!-- 评论 e -->
<!-- 规格参数 s -->
<div class="nybox proTfg">
<div class="w1440">
<div class="sptit" id="link4">规格参数</div>
<div class="splist">
<p class="sp1">产品容量</p>
<p class="sp2">12000mAh</p>
</div>
<div class="splist">
<p class="sp1">产品重量</p>
<p class="sp2">0.22 KG</p>
</div>
<div class="splist">
<p class="sp1">产品颜色:</p>
<p class="sp2">白</p>
</div>
<div class="splist">
<p class="sp1">产品电芯</p>
<p class="sp2">聚合物</p>
</div>
<div class="splist">
<p class="sp1">产品输入</p>
<p class="sp2">Micro USB(5V2A</p>
</div>
<div class="splist">
<p class="sp1">产品输出</p>
<p class="sp2">USB-A(5V2A)*1 + USB-A（5V1A）*</p>
</div>
<div class="splist">
<p class="sp1">产品尺寸</p>
<p class="sp2">132*71*21mm</p>
</div>
</div>
</div>
<!-- 规格参数 e -->
<!-- 相关下载 s -->
<div class="nybox proTfg">
<div class="w1440">
<div class="sptit" id="link5">相关下载</div>
<div class="xz">
<p class="xztit">驱动下载</p>
<p class="xz1"><a href="#"><i></i>Win 7/Vista</a></p>
<p class="xz1"><a href="#"><i></i>Win 8.1</a></p>
<p class="xz1"><a href="#"><i></i>Windows XP</a></p>
</div>
<div class="xz">
<p class="xztit">其他下载</p>
<p class="xz1"><a href="#"><i></i>手册</a></p>
</div>
</div>
</div>
<!-- 相关下载 e -->
<!-- 常见问题 s -->
<div class="nybox proTfg">
<div class="w1440">
<div class="sptit" id="link6">常见问题</div>
<div class="ans" style="display:block;">
<div class="antit">
<i></i>哪些设备与L12000便携式充电器兼容？
</div>
<div class="anbox">
<p>aaaL12000与Android，Apple和几乎所有其他通过USB充电的设备兼容。（请注意：如果设备的输入电流要求高于2.4A，它可能会慢慢充电或根本不充电。）</p>
</div>
</div>
<div class="ans">
<div class="antit">
<i></i>便携式充电器需要多长时间才能充满电？
</div>
<div class="anbox">
<p>bbbL12000与Android，Apple和几乎所有其他通过USB充电的设备兼容。（请注意：如果设备的输入电流要求高于2.4A，它可能会慢慢充电或根本不充电。）</p>
</div>
</div>
<div class="ans">
<div class="antit">
<i></i>便携式充电器可以在充电时为其他设备充电吗？
</div>
<div class="anbox">
<p>cccL12000与Android，Apple和几乎所有其他通过USB充电的设备兼容。（请注意：如果设备的输入电流要求高于2.4A，它可能会慢慢充电或根本不充电。）</p>
</div>
</div>
<div class="ans">
<div class="antit">
<i></i>我的设备充电电流为1安培，L12000便携式充电器的2.4安培输出会对它造成伤害吗？
</div>
<div class="anbox">
<p>dddL12000与Android，Apple和几乎所有其他通过USB充电的设备兼容。（请注意：如果设备的输入电流要求高于2.4A，它可能会慢慢充电或根本不充电。）</p>
</div>
</div>
<div class="ans">
<div class="antit">
<i></i>哪些设备与L12000便携式充电器兼容？
</div>
<div class="anbox">
<p>eeeL12000与Android，Apple和几乎所有其他通过USB充电的设备兼容。（请注意：如果设备的输入电流要求高于2.4A，它可能会慢慢充电或根本不充电。）</p>
</div>
</div>
</div>
</div>
<!-- 常见问题 e -->
<script type="text/javascript">
$(function(){
var $category=$(".ans .anbox");
$category.hide();
$(".ans .antit").click(function(){
if($(this).next(".anbox").is(":visible")){
$(this).removeClass('on').next().slideUp(800);
$(this).parent('.ans').removeClass('on');
$(this).children("i").removeClass("ons")
}else{
$category.hide();
$(".ans .antit").removeClass('on');
$(this).children("i").addClass("ons")
$(this).addClass('on').next().slideDown(800);
$(this).parent('.ans').addClass('on');
}
});
});
$(function(){
$('a[href*=#],area[href*=#]').click(function() {
console.log(this.pathname)
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');
if ($target.length) {
var targetOffset = $target.offset().top-50;
$('html,body').animate({
scrollTop: targetOffset
},800);
return false; //页面锚点跳转动画 后面的800是锚点跳转的时间 800ms
}
}
});
})
$(document).ready(function(){
//获取div-one距离顶部的距离
var navtop=$(".warpa").offset().top;
$(document).scroll(function(){
//获取滚动条滚动的高度
var scroltop=$(document).scrollTop();
if (scroltop > navtop){
$(".warpa").css({
"position":"fixed",
"top":"0px",
"left":"0px",
"right":"0px",
"z-index":"999"
})
}else {
$(".warpa").css({
"position":"",
"top":"",
"left":"",
"right":"",
"z-index":""
})
}
})
})
$(function(){
$(window).scroll(function(){
var arr=[]
$.each($(".proTfg"),function(k,v){
arr[k]=$(this).offset().top+$(this).height();
})
$.each(arr,function(k,v){
if(($(window).scrollTop()+$(".cpa li").eq(k-1).height()+0)<v){
if(!$(".cpa li").eq(k).hasClass("current")){
$(".cpa li").eq(k).attr("class","current").siblings().removeClass();
}
return false;
}
})
})
})
</script>
</div>
<!-- bottom s -->
<!--#include file="include/bottom.html" -->
<!-- bottom e -->
</body>
</html>