Files
orico-official-website-old/app/us/view/include/tophome-header.phtml
2024-10-29 14:04:59 +08:00

615 lines
25 KiB
PHTML
Executable File

<div class="Container head-nav" class="scroll" >
<div class="nav-1">
<!--<img src="__PUBLIC__/weben/images/indeximg/logo-white.png" >-->
<a href="__ORICOROOT__"> <div id="top-logo"></div></a>
</div>
<div class="wrapper nav-2">
<nav id="booNavigation" class="booNavigation">
<ul>
<!-- <li class="navItem">
<a class="acolor" href="#" title="New Arrival">New Arrival</a>
</li> -->
<li class="navItem allbtn tabs-vertical">
<a class="acolor" href="#" title="Products">Products</a>
<div class="downimg"></div>
<?php if (!empty($productCategory)): ?>
<div class="navContent jspop">
<ul>
<?php foreach ($productCategory as $kp => $cate):?>
<li>
<a href="__ORICOROOT__/product/category/<?php echo $cate['id']?>.html" class="tab-active" data-index="<?php echo $kp; ?>" ><?php echo $cate['name']; ?></a>
</li>
<?php endforeach; ?>
</ul>
<div class="tabs-content-placeholder">
<?php foreach ($productCategory as $key => $value):
if (isset($category['id']) && $category['id'] == $value['id'])
$oneLevelCategory = isset($value['child']) ? $value['child'] : [];
$have_3_child = 0;
if (!empty($value['child']))
{
foreach ($value['child'] as $k => $v)
{
if (!empty($v['child']))
{
$have_3_child = 1;
break;
}
}
}
?>
<?php if (!empty($value['child'])): ?>
<div class="tabs-content-placeholder-div tab-content-active">
<?php foreach ($value['child'] as $k => $v): ?>
<dl>
<dt>
<a class="ui-link" href="__ORICOROOT__/product/subcategory/<?php echo $v['id']?>.html"><img src="<?php echo $v['m_icon']; ?>"><?php echo $v['name']; ?></a>
</dt>
<?php if (!empty($v['child'])): ?>
<?php foreach ($v['child'] as $index => $item): ?>
<dd><a href="__ORICOROOT__/product/subcategory/<?php echo $item['id']?>.html"><?php echo $item['name']; ?></a></dd>
<?php endforeach; ?>
<?php endif; ?>
</dl>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
<?php endif; ?>
</li>
<?php
if ($nav_header): ?>
<?php
foreach ($nav_header as $kn => $nav):
if(strpos($nav['url'], 'http://') !== false || strpos($nav['url'], 'https://') !== false) {
$link = $nav['url'];
}
else{
if($nav['url']){
$link = '__ORICOROOT__/'.$nav['url'];
}
else{
$link = '#';
}
}
if($kn < 7):
?>
<li class="navItem">
<a class="acolor" <?php if($nav['is_new_window_open']){echo "target='_blank'";} ?> href="<?php echo $link; ?>" title="<?php echo $nav['name']; ?>"><?php echo $nav['name']; ?></a>
<?php if (!empty($nav['items'])): ?>
<div class="downimg"></div>
<ol class="navContent navContent1">
<?php foreach ($nav['items'] as $kt => $child):
if(strpos($child['url'], 'http://') !== false || strpos($child['url'], 'https://') !== false) {
$childLink = $child['url'];
}
else{
$childLink = '__ORICOROOT__/'.$child['url'];
}
?>
<li >
<a href="<?php echo $childLink; ?>" <?php if($child['is_new_window_open']){echo "target='_blank'";} ?> title="<?php echo $child['name']; ?>" ><?php echo $child['name']; ?></a>
</li>
<?php endforeach; ?>
</ol>
<?php endif; ?>
</li>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
</ul>
</nav>
</div>
<div class="nav-3">
<div>
<!--<img class="openModalBtn" src="__PUBLIC__/weben/images/indeximg/search.png" class="searchimg">-->
<div class="openModalBtn" class=""></div>
</div>
<div>
<!--<img src="__PUBLIC__/weben/images/indeximg/checklanguage.png" class="checkimg" id="countrycheck">-->
<div class="countrycheck" class=""></div>
<div id="top-country" class="hidden">
<ul>
<li class="desktopli1">
<span class="close-btn1" id="closeModalBtn1">&times;</span>
</li>
<a href="https://www.orico.com.cn/" class="cn" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/CN.png" /></div>
<div class="desktop-10">China - 中文简体</div>
</li></a>
<a href="https://www.orico.cc/us" class="ca" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/US.png" /></div>
<div class="desktop-10">USA - English</div>
</li></a>
<a href="https://www.oricobr.com" class="us" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/BR.png" /></div>
<div class="desktop-10">Brazil - português</div>
</li></a>
<a href="https://www.ORICOPERU.com" class="us" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/MX.png" /></div>
<div class="desktop-10">Peru - español</div>
</li></a>
<a href="https://www.orico.cc/th" class="hk" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/TH.png" /></div>
<div class="desktop-10">Thailand - ไทย</div>
</li></a>
<a href="https://www.orico.cc/id" class="jp" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/ID.png" /></div>
<div class="desktop-10">Indonesia - bahasa Indonesia</div>
</li></a>
<a href="https://www.orico.cc/vn" class="kr" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/VN.png" /></div>
<div class="desktop-10">Vietnam - Tiếng Việt</div>
</li></a>
<a href="https://www.orico.shop/" class="be" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/NL.png" /></div>
<div class="desktop-10">Netherlands - English</div>
</li></a>
<a href="http://www.oricoturkiye.com/" class="tr" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/TR.png" /></div>
<div class="desktop-10">Turkiye - Türkçe</div>
</li></a>
<a href="https://orico-iran.ir" class="bh" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/IR.png" /></div>
<div class="desktop-10">Iran - فارسی</div>
</li></a>
<a href="http://www.orico.com.au/ " class="au" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/AU.png" /></div>
<div class="desktop-10">Australia - English</div>
</li></a>
<a href="https://orico-russia.ru " class="au" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/countries/RU.png" /></div>
<div class="desktop-10">Russia - Россия</div>
</li></a>
</ul>
</div>
</div>
</div>
</div>
<div class="Container head-nav fixednav" style="display:none" >
<div class="nav-1">
<!--<img src="__PUBLIC__/weben/images/indeximg/logo-white.png" >-->
<a href="__ORICOROOT__"> <div id="top-logo"></div></a>
</div>
<div class="wrapper nav-2">
<nav id="booNavigation" class="booNavigation">
<ul>
<!-- <li class="navItem">
<a class="acolor" href="#" title="New Arrival">New Arrival</a>
</li> -->
<li class="navItem allbtn tabs-vertical" >
<a class="acolor" href="#" title="Products">Products</a>
<div class="downimg"></div>
<?php if (!empty($productCategory)): ?>
<div class="navContent jspop">
<ul>
<?php foreach ($productCategory as $kp => $cate):?>
<li>
<a href="__ORICOROOT__/product/category/<?php echo $cate['id']?>.html" class="tab-active" data-index="<?php echo $kp; ?>" ><?php echo $cate['name']; ?></a>
</li>
<?php endforeach; ?>
</ul>
<div class="tabs-content-placeholder">
<?php foreach ($productCategory as $key => $value):
if (isset($category['id']) && $category['id'] == $value['id'])
$oneLevelCategory = isset($value['child']) ? $value['child'] : [];
$have_3_child = 0;
if (!empty($value['child']))
{
foreach ($value['child'] as $k => $v)
{
if (!empty($v['child']))
{
$have_3_child = 1;
break;
}
}
}
?>
<?php if (!empty($value['child'])): ?>
<div class="tabs-content-placeholder-div tab-content-active">
<?php foreach ($value['child'] as $k => $v): ?>
<dl>
<dt>
<a class="ui-link" href="__ORICOROOT__/product/subcategory/<?php echo $v['id']?>.html"><img src="<?php echo $v['m_icon']; ?>"><?php echo $v['name']; ?></a>
</dt>
<?php if (!empty($v['child'])): ?>
<?php foreach ($v['child'] as $index => $item): ?>
<dd><a href="__ORICOROOT__/product/subcategory/<?php echo $item['id']?>.html"><?php echo $item['name']; ?></a></dd>
<?php endforeach; ?>
<?php endif; ?>
</dl>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
<?php endif; ?>
</li>
<?php
if ($nav_header): ?>
<?php
foreach ($nav_header as $kn => $nav):
if(strpos($nav['url'], 'http://') !== false || strpos($nav['url'], 'https://') !== false) {
$link = $nav['url'];
}
else{
if($nav['url']){
$link = '__ORICOROOT__/'.$nav['url'];
}
else{
$link = '#';
}
}
if($kn < 7):
?>
<li class="navItem">
<a class="acolor" <?php if($nav['is_new_window_open']){echo "target='_blank'";} ?> href="<?php echo $link; ?>" title="<?php echo $nav['name']; ?>"><?php echo $nav['name']; ?></a>
<?php if (!empty($nav['items'])): ?>
<div class="downimg"></div>
<ol class="navContent navContent1">
<?php foreach ($nav['items'] as $kt => $child):
if(strpos($child['url'], 'http://') !== false || strpos($child['url'], 'https://') !== false) {
$childLink = $child['url'];
}
else{
$childLink = '__ORICOROOT__/'.$child['url'];
}
?>
<li >
<a href="<?php echo $childLink; ?>" <?php if($child['is_new_window_open']){echo "target='_blank'";} ?> title="<?php echo $child['name']; ?>" ><?php echo $child['name']; ?></a>
</li>
<?php endforeach; ?>
</ol>
<?php endif; ?>
</li>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
</ul>
</nav>
</div>
<div class="nav-3">
<div>
<!--<img class="openModalBtn" src="__PUBLIC__/weben/images/indeximg/search.png" class="searchimg">-->
<div class="openModalBtn" class=""></div>
</div>
<div>
<!--<img src="__PUBLIC__/weben/images/indeximg/checklanguage.png" class="checkimg" id="countrycheck">-->
<div class="countrycheck" class=""></div>
<div id="top-country" class="hidden">
<ul>
<li class="desktopli1">
<span class="close-btn1" id="closeModalBtn1">&times;</span>
</li>
<a href="https://www.orico.com.cn/" class="cn" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/CN.png" /></div>
<div class="desktop-10">China - 中文简体</div>
</li></a>
<a href="https://www.orico.cc/us" class="ca" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/US.png" /></div>
<div class="desktop-10">USA - English</div>
</li></a>
<a href="https://www.oricobr.com" class="us" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/BR.png" /></div>
<div class="desktop-10">Brazil - português</div>
</li></a>
<a href="https://www.ORICOPERU.com" class="us" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/MX.png" /></div>
<div class="desktop-10">Peru - español</div>
</li></a>
<a href="https://www.orico.cc/th" class="hk" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/TH.png" /></div>
<div class="desktop-10">Thailand - ไทย</div>
</li></a>
<a href="https://www.orico.cc/id" class="jp" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/ID.png" /></div>
<div class="desktop-10">Indonesia - bahasa Indonesia</div>
</li></a>
<a href="https://www.orico.cc/vn" class="kr" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/VN.png" /></div>
<div class="desktop-10">Vietnam - Tiếng Việt</div>
</li></a>
<a href="https://www.orico.shop/" class="be" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/NL.png" /></div>
<div class="desktop-10">Netherlands - English</div>
</li></a>
<a href="http://www.oricoturkiye.com/" class="tr" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/TR.png" /></div>
<div class="desktop-10">Turkiye - Türkçe</div>
</li></a>
<a href="https://orico-iran.ir" class="bh" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/IR.png" /></div>
<div class="desktop-10">Iran - فارسی</div>
</li></a>
<a href="http://www.orico.com.au/ " class="au" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/map/AU.png" /></div>
<div class="desktop-10">Australia - English</div>
</li></a>
<a href="https://orico-russia.ru " class="au" target="_blank"><li class="desktopli">
<div class="desktop-2"><img src="__PUBLIC__/web/images/countries/RU.png" /></div>
<div class="desktop-10">Russia - Россия</div>
</li></a>
</ul>
</div>
</div>
</div>
</div>
<div id="modal" class="modal">
<div class="modal-content Search">
<span class="close-btn" id="closeModalBtn">&times;</span>
<input type="text" name="keywords" id="search-in" value="" />
<div id="search" class="search_content search_default"></div>
<div class="modal_1">
<p class="tit1">Search History</p>
<div>
<ul>
<?php
$historyList = getBannerList(79, 5);
if ($historyList):
?>
<?php foreach ($historyList as $kh => $history): ?>
<li><a href="<?php echo $history['url']; ?>"><?php echo $history['name']; ?></a></li>
<?php endforeach; ?>
<?php endif; ?>
</ul>
</div>
</div>
<div class="modal_2">
<p class="tit1">Popular Products</p>
<?php
if ($popular_list):
?>
<?php foreach ($popular_list as $kp => $popular): ?>
<div class="picture21">
<a href="__ORICOROOT__<?php echo url_rewrite('productdetail', ['id' => $popular['id']]); ?>"><img title="<?php echo $popular['name']; ?>" class="picture21-img" src="<?php echo getImage($popular['list_bk_img']); ?>"></a>
<div class="title" title="<?php echo $popular['name']; ?>"> <p><?php echo $popular['name']; ?></p></div>
<div class="subtitle"><?php echo $popular['shortname']; ?></div>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>
<!-- 这里可以放置表单、其他内容等 -->
</div>
</div>
<!--导航固定滚动-->
<script type="text/javascript">
$(function () {
var nav = $('fixednav') //得到导航对象
var win = $(window) //得到窗口对象
var sc = $(document) //得到document文档对象。
var clinetHeight = $(document.body).height()
var availHeight = $(window).height() + 60
win.scroll(function () {
if (clinetHeight >= availHeight) {
if (sc.scrollTop() > 60) {
$('.fixednav').show()
// $(".bg_white_nav").hide();
} else {
$('.fixednav').hide()
// $(".bg_white_nav").show();
}
}
})
})
</script>
<script type="text/javascript">
$(document).ready(function() {
var widget = $('.tabs-vertical');
var tabs = widget.find(' ul a'),
content = widget.find('.tabs-content-placeholder-div');
tabs.on('mouseover', function (e) {
e.preventDefault();
// Get the data-index attribute, and show the matching content div
var index = $(this).data('index');
tabs.removeClass('tab-active');
content.removeClass('tab-content-active');
$(this).addClass('tab-active');
content.eq(index).addClass('tab-content-active');
});
});
$(document).ready(function() {
$('.countrycheck').click(function() {
$('#top-country').toggleClass('hidden');
});
$('#closeModalBtn1').click(function() {
$('#top-country').toggleClass('hidden');
});
});
$(document).ready(function() {
// 点击打开按钮显示弹出框
$('.openModalBtn').click(function() {
$('#modal').fadeIn();
});
// 点击关闭按钮或背景模态框,隐藏弹出框
$('#closeModalBtn, .modal').click(function() {
$('#modal').fadeOut();
});
// 防止点击弹出框内容时关闭弹出框
$('.modal-content').click(function(e) {
e.stopPropagation();
});
});
/************搜索****************/
$(function() {
var search_input = $(".Search input");
var search_content = $(".search_content");
$(search_input).on("keyup", function(e){
$("#search-in").keyup(function(event) {
if (event && event.keyCode === 13) {
var keywords = $("#search-in").val();
var href = "<?php echo url('/us/search'); ?>?skeyword=" + encodeURIComponent(keywords);
location.href = href;
$("#modal").hide();
}
});
});
$(".search_content").bind("click", function(event) {
var skeyword = $(".Search input").val();
if(skeyword){
var href = "<?php echo url('/us/search'); ?>?skeyword=" + encodeURIComponent(skeyword);
location.href = href;
}
else{
var href = "<?php echo url('/us/search'); ?>";
location.href = href;
}
});
});
$(document).ready(function() {
$(".scroll").mouseover(function(event) {
$(this).addClass("colorw");
$(".acolor").addClass("colorb");
$("#top-logo").addClass("backmove");
$(".downimg").addClass("backmove1");
$(".openModalBtn").addClass("backmove2");
$(".countrycheck").addClass("backmove2");
});
$(".scroll").mouseleave(function(event) {
$(this).removeClass("colorw");
$(".acolor").removeClass("colorb");
$("#top-logo").removeClass("backmove");
$(".downimg").removeClass("backmove1");
$(".openModalBtn").removeClass("backmove2");
$(".countrycheck").removeClass("backmove2");
// console.log('asdasdasdsad')
});
});
</script>
<style type="text/css">
.fixednav {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
z-index: 99;
background:#000;}
.head-nav {
position: fixed;
top: 0;
width: 100%;
/* height: 60px; */
display: flex;
}
.colorw{
background-color: white;
color: black;
}
.colorb{
color: black !important;
}
.backmove{
background: url('__PUBLIC__/weben/images/indeximg/toplogo.png') no-repeat !important;
background-position:0px -38px !important;
}
.backmove1{
background-position:0px -12px !important;
}
.backmove2{
background-position:0px -24px !important;
}
.downimg:hover{
width: 12px;
height:12px;
background: url('__PUBLIC__/weben/images/indeximg/jtdown1.png') no-repeat;
background-position:0px -12px;
overflow: hidden;
}
.downimg{
width: 12px;
height:12px;
background: url('__PUBLIC__/weben/images/indeximg/jtdown1.png') no-repeat;
background-position:0px 0px;
overflow: hidden;
}
#top-logo{
width: 148px;
height: 38px;
background: url('__PUBLIC__/weben/images/indeximg/toplogo.png') no-repeat;
background-position:0px 0px;
float: right;
margin-top: 10px;
}
.openModalBtn{
width: 24px;
height: 24px;
background: url('__PUBLIC__/weben/images/indeximg/topsearch.png') no-repeat;
background-size: cover;
position: absolute;
top: 50%;
margin-top: -12px;
}
.countrycheck{
width: 24px;
height: 24px;
background: url('__PUBLIC__/weben/images/indeximg/toplanguage.png') no-repeat;
background-size: cover;
position: absolute;
top: 50%;
margin-top: -12px;
}
#search-in{
margin-left: 10%;
margin-top: 5%;
width: 80%;
height: 44px;
border: 1px solid grey;
border-radius:22px;
background: url('__PUBLIC__/weben/images/indeximg/sousuo1.png') no-repeat;
background-position: 95% 50%;
padding-left: 5%;
}
</style>