384 lines
14 KiB
PHTML
Executable File
384 lines
14 KiB
PHTML
Executable File
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>ORICO - USB Storage Adapters, Chargers, Hubs, and More</title>
|
||
<meta name="Keywords" content="Computer Peripheral, Phone Peripheral, Electronics ">
|
||
<meta name="Description" content="Online Shopping for reputable consumer electronics. High quality, fast shipping, affordable prices, sold in over 100 countries, and thousands of reviews.">
|
||
{include file="include/head" /}
|
||
<script type="text/javascript">
|
||
var navID = "1";
|
||
</script>
|
||
<link rel="stylesheet" type="text/css" href="__PUBLIC__/m_web/js/bxslider/jquery.bxslider.css">
|
||
<script type="text/javascript" src="__PUBLIC__/m_web/js/bxslider/jquery.bxslider.min.js"></script>
|
||
<link rel="stylesheet" type="text/css" href="__PUBLIC__/m_web/css/swiper.css" />
|
||
<script src="__PUBLIC__/m_weben/js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
|
||
<script src="__PUBLIC__/m_weben/js/modernizr.js"></script>
|
||
<script src="__PUBLIC__/m_weben/js/jquery.mobile.custom.min.js"></script>
|
||
<script src="__PUBLIC__/m_weben/js/main.js"></script>
|
||
</head>
|
||
<body οnlοad="openwin()">
|
||
<div id="content">
|
||
<!--头部-->
|
||
{include file="include/top" /}
|
||
<!--banner-->
|
||
{include file="include/banner" /}
|
||
|
||
|
||
<!--类别-->
|
||
<?php
|
||
$categoryList = getBannerList(71, 5);
|
||
if ($categoryList):
|
||
?>
|
||
<div class="bg-w">
|
||
<div class="m_Container">
|
||
<div class="swiper-container" id="case4">
|
||
<div class="swiper-wrapper">
|
||
<?php foreach ($categoryList as $k => $category): ?>
|
||
<div class="swiper-slide">
|
||
<a href="<?php echo $category['url']; ?>">
|
||
<img src="<?php echo getImage($category['picture']); ?>">
|
||
<p><?php echo $category['name']; ?></p>
|
||
</a>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
|
||
</div>
|
||
<!-- 分页器 -->
|
||
<div class="swiper-pagination"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<!--广告-->
|
||
<?php
|
||
$collectionList = getBannerList(72, 3);
|
||
if ($collectionList):
|
||
?>
|
||
<div class="index-img">
|
||
<?php foreach ($collectionList as $kc => $collection): ?>
|
||
<img src="<?php echo getImage($collection['picture']); ?>">
|
||
<div class="Innew-text">
|
||
<p class="title"> <?php echo $collection['name']; ?></p>
|
||
<p class="more">
|
||
<a href="<?php echo $collection['url']; ?>" target="_blank">
|
||
View all
|
||
<img src="__PUBLIC__/m_weben/images/more.png">
|
||
</a>
|
||
</p>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
|
||
<!--Featured Products-->
|
||
<?php
|
||
if (!empty($recomment_items)):
|
||
?>
|
||
<div class="m_Container">
|
||
<div class="swiper-container" id="case5">
|
||
<div class="swiper-wrapper text_center">
|
||
<?php foreach ($recomment_items as $kr => $item): ?>
|
||
<div class="swiper-slide inproimg">
|
||
<a href="__ORICOROOT__<?php echo url_rewrite('productdetail', ['id' => $item['id']]); ?>"><img src="<?php echo getImage($item['list_bk_img']); ?>"></a>
|
||
<div class="inprotext">
|
||
<p class="text_center title"><?php echo $item['name']; ?></p>
|
||
<p class="t-f16"><?php echo $item['shortname']; ?></p>
|
||
<p class="more">
|
||
<a href="__ORICOROOT__<?php echo url_rewrite('productdetail', ['id' => $item['id']]); ?>">
|
||
Learn More
|
||
<img src="__PUBLIC__/m_weben/images/more-r.png">
|
||
</a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
|
||
</div>
|
||
<div class="inpro-text">
|
||
<p class="more">View all
|
||
<img src="__PUBLIC__/m_weben/images/more.png">
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<!--专题图片展示-->
|
||
|
||
<?php
|
||
$recomendList = getBannerList(81, 2);
|
||
if ($recomendList):
|
||
?>
|
||
<?php
|
||
foreach ($recomendList as $kr => $recomend):
|
||
$styles='top';
|
||
if($recomend['style']==3) {
|
||
$styles='right';
|
||
}
|
||
elseif($recomend['style']==2){
|
||
$styles='left';
|
||
}
|
||
elseif($recomend['style']==4){
|
||
$styles='bottom';
|
||
}
|
||
?>
|
||
<div class="indocking">
|
||
<img src="<?php echo $recomend['picture']; ?>">
|
||
<iframe width="100%" style="height:50rem;z-index:9999;" src="/frontend/weben/images/home/UFSD-I-en.mp4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
|
||
<div class="position_a text_center">
|
||
<p class=" margin-top-70 f_weight_500 timetitle"><?php echo $recomend['name']; ?> </p>
|
||
<p class=" margin-top-14 f_weight_100 timedesin"><?php echo $recomend['description']; ?></p>
|
||
<p class=" margin-top-20 f_weight_100 ">
|
||
<span class="timeblue">Learn More
|
||
<img src="__PUBLIC__/m_weben/images/more-r.png">
|
||
</span>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
<?php endif; ?>
|
||
|
||
<?php
|
||
$hotList = getBannerList(74, 4);
|
||
if ($hotList):
|
||
?>
|
||
<?php foreach ($hotList as $kh => $hot): ?>
|
||
<div class="indocking">
|
||
<a href="<?php echo $hot['url']; ?>"><img src="<?php echo $hot["picture"]; ?>"></a>
|
||
<div class="position_a text_center">
|
||
<p class=" margin-top-70 f_weight_500 timetitle"><?php echo $hot['name']; ?> </p>
|
||
<p class=" margin-top-14 f_weight_100 timedesin"><?php echo $hot['description']; ?></p>
|
||
<p class=" margin-top-20 f_weight_100">
|
||
<a href="<?php echo $hot['url']; ?>" class=" timeblue">
|
||
Learn More
|
||
<img src="__PUBLIC__/m_weben/images/more-r.png">
|
||
</a>
|
||
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
|
||
<?php endif; ?>
|
||
|
||
<!--遮罩图片效果-->
|
||
<div class="Tech-text">
|
||
<h3>Orico Technology</h3>
|
||
<p>designed to be just as easy to learn as iPhone. chatting with friends.</p>
|
||
<p class="timeblue">
|
||
<a href="#">Learn More
|
||
<img src="__PUBLIC__/m_weben/images/more-r.png">
|
||
</a>
|
||
</p>
|
||
</div>
|
||
<div class="section section-blends section-full">
|
||
<div class="section-stack section-stack--center ">
|
||
<div class="section-stack__main">
|
||
<div class="before-after shadow text-custom ba-slider" style="--text-color: 255 255 255;">
|
||
<img src="__PUBLIC__/m_weben/images/back-img01.jpg">
|
||
<div class="resize">
|
||
<img src="__PUBLIC__/m_weben/images/back-img02.jpg">
|
||
</div>
|
||
|
||
<span class="handle"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!--时间轴效果-->
|
||
<?php
|
||
$brandList = getBannerList(75, 3);
|
||
if ($brandList):
|
||
?>
|
||
<section class="cd-horizontal-timeline">
|
||
<div class="events-content">
|
||
<ul>
|
||
<?php foreach ($brandList as $kb => $brand): ?>
|
||
<li <?php if($kb==0):?>class="selected"<?php endif; ?> data-date="16/01/2014">
|
||
<img src="<?php echo $brand['picture']; ?>">
|
||
<div class="position_a text_center">
|
||
<p class=" margin-top-70 f_weight_500 timetitle"><?php echo $brand['name']; ?> </p>
|
||
<p class=" margin-top-14 f_weight_100 timedesin"><?php echo $brand['description']; ?></p>
|
||
<p class=" margin-top-20 f_weight_100">
|
||
<a class=" timeblue" href="<?php echo $brand['url']; ?>">
|
||
Learn More
|
||
<img src="__PUBLIC__/m_weben/images/more-r.png">
|
||
</a>
|
||
</p>
|
||
</div>
|
||
</li>
|
||
<?php endforeach; ?>
|
||
</ul>
|
||
</div>
|
||
<!-- .events-content -->
|
||
<div class="timeline">
|
||
<div class="events-wrapper">
|
||
<div class="events">
|
||
<ol>
|
||
<?php foreach ($brandList as $kd => $itm): ?>
|
||
<li>
|
||
<a href="#0" data-date="16/01/2014" <?php if($kd==0):?>class="selected"<?php endif; ?>><?php echo $itm['sort']; ?></a>
|
||
</li>
|
||
<?php endforeach; ?>
|
||
|
||
</ol>
|
||
<span class="filling-line" aria-hidden="true"></span>
|
||
</div>
|
||
<!-- .events -->
|
||
</div>
|
||
<!-- .events-wrapper -->
|
||
<ul class="cd-timeline-navigation">
|
||
<li>
|
||
<a href="#0" class="prev inactive">Prev</a>
|
||
</li>
|
||
<li>
|
||
<a href="#0" class="next">Next</a>
|
||
</li>
|
||
</ul>
|
||
<!-- .cd-timeline-navigation -->
|
||
</div>
|
||
<!-- .timeline -->
|
||
</section>
|
||
<?php endif; ?>
|
||
<!--number-->
|
||
<?php
|
||
$dataList = getBannerList(78, 3);
|
||
if ($dataList):
|
||
?>
|
||
<div class="num-bg clearfix">
|
||
<ul>
|
||
<?php foreach ($dataList as $kd => $feed): ?>
|
||
<li>
|
||
<h3><?php echo $feed['name']; ?></h3>
|
||
<p><?php echo $feed['description']; ?></p>
|
||
</li>
|
||
<?php endforeach; ?>
|
||
|
||
</ul>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
|
||
<!--图片切换-->
|
||
<?php
|
||
$newsList = getBannerList(77, 10);
|
||
if ($newsList):
|
||
?>
|
||
<div class="swiper-container" id="case7">
|
||
<div class="swiper-wrapper">
|
||
<?php foreach ($newsList as $kc => $news): ?>
|
||
<div class="swiper-slide">
|
||
<a href="<?php echo $brand['url']; ?>">
|
||
<div class="title"><?php echo $news['name']; ?></div>
|
||
<img src="<?php echo $news['picture']; ?>">
|
||
</a>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
|
||
</div>
|
||
<!-- 分页器 -->
|
||
<div class="swiper-pagination"></div>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<?php
|
||
if ($faqData):
|
||
?>
|
||
<div class="faq">
|
||
<div class="faq-title ">
|
||
<h3>FAQ</h3>
|
||
<h5>What are you most concerned about.</h5>
|
||
<p>Our customer support is available Monday to Friday: 9am-6:00pm. Average answer time: 24h</p>
|
||
</div>
|
||
<?php foreach ($faqData as $kf => $faq): ?>
|
||
<dl>
|
||
<dt class="cursor_p"><?php echo $faq['name']; ?><i class="rotate icon-arrow"></i>
|
||
</dt>
|
||
<dd><?php echo str_replace("\r",'',nl2br($faq['content'])); ?></dd>
|
||
</dl>
|
||
<?php endforeach; ?>
|
||
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
|
||
{include file="include/bottom" /}
|
||
|
||
</div>
|
||
|
||
<script type="text/javascript">
|
||
/*banner*/
|
||
$(function(){
|
||
$('.banner_list').bxSlider({
|
||
});
|
||
});
|
||
/*banner*/
|
||
$(function(){
|
||
$('.news_list').bxSlider({
|
||
speed:5,
|
||
auto:true,
|
||
pager:false,
|
||
});
|
||
});
|
||
/* 幻灯片轮播*/
|
||
var mySwiper4 = new Swiper("#case4",{
|
||
loop : false, //允许从第一张到最后一张，或者从最后一张到第一张 循环属性
|
||
slidesPerView :4, // 设置显示四张
|
||
centeredSlides : true, //使当前图片居中显示
|
||
centeredSlidesBounds: true, //使左右两边的图片始终贴合边缘
|
||
/* slidesOffsetBefore : 100, //偏移，使第一张图片向右偏移100px */
|
||
autoplay: false,//可选选项，自动滑动
|
||
initialSlide :0,//默认显示第二张图片索引从0开始
|
||
speed:2000,//设置过度时间
|
||
/* grabCursor: true,//鼠标样式根据浏览器不同而定 */
|
||
autoplay :false, /* 设置每隔3000毫秒切换 */
|
||
|
||
});
|
||
/* 产品图片轮播*/
|
||
var mySwiper4 = new Swiper("#case5",{
|
||
loop : false, //允许从第一张到最后一张，或者从最后一张到第一张 循环属性
|
||
slidesPerView :1.4, // 设置显示一张
|
||
centeredSlides : true, //使当前图片居中显示
|
||
centeredSlidesBounds: true, //使左右两边的图片始终贴合边缘
|
||
/* slidesOffsetBefore : 100, //偏移，使第一张图片向右偏移100px */
|
||
autoplay: false,//可选选项，自动滑动
|
||
initialSlide :0,//默认显示第二张图片索引从0开始
|
||
speed:2000,//设置过度时间
|
||
/* grabCursor: true,//鼠标样式根据浏览器不同而定 */
|
||
autoplay :false, /* 设置每隔3000毫秒切换 */
|
||
});
|
||
/* 覆盖流3d切换 */
|
||
var mySwiper = new Swiper('#case7', {
|
||
loop : true, //允许从第一张到最后一张，或者从最后一张到第一张 循环属性
|
||
effect : 'coverflow', //轮播效果，coverflow覆盖流效果
|
||
slidesPerView :2.1,
|
||
centeredSlides: true,
|
||
slidesOffsetBefore : 150,//偏移，使第一张图片向右偏移150px */
|
||
autoplay: false, //可选选项，自动滑动
|
||
initialSlide :1,//默认显示第二张图片索引从0开始
|
||
speed:3000,//设置过度时间
|
||
/* grabCursor: true,//鼠标样式根据浏览器不同而定 */
|
||
autoplay :false, /* 设置每隔3000毫秒切换 */
|
||
<!-- 分页器 -->
|
||
pagination: {
|
||
el: '.swiper-pagination',
|
||
clickable :true, /* 可点击切换 */
|
||
dynamicBullets: true, /* 动力球样式 */
|
||
},
|
||
});
|
||
</script>
|
||
|
||
<script type="text/javascript" src="__PUBLIC__/m_weben/js/before-after.min.js"></script>
|
||
|
||
<script type="text/javascript">
|
||
$(function () {
|
||
$('.before-after').beforeAfter();
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|