xpz2018
3 years ago
6 changed files with 1016 additions and 22 deletions
Split View
Diff Options
-
28src/index.html
-
325src/news/new1.html
-
325src/news/new2.html
-
325src/news/new3.html
-
6src/skin/css/main.css
-
29src/skin/js/custom.js
@ -0,0 +1,325 @@ |
|||
<!DOCTYPE html> |
|||
<!--[if IE 7 ]> <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]--> |
|||
<!--[if IE 8 ]> <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]--> |
|||
<!--[if IE 9 ]> <html lang="en-gb" class="isie ie9 no-js"> <![endif]--> |
|||
<!--[if (gt IE 9)|!(IE)]><!--> |
|||
<html class="no-js"> |
|||
<!--<![endif]--> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|||
<meta name="renderer" content="webkit" /> |
|||
<meta name="robots" content="index, follow" /> |
|||
<title>普睿特—智能包装云工厂</title> |
|||
<meta name="description" content="普睿特—智能包装云工厂，是广州印刷厂，提供印刷、包装等服务，包括茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册等业务，品质稳定,价格合理,交付准时,量身定制包装盒系统方案。" /> |
|||
<meta name="keywords" content="普睿特,广州印刷,印刷,包装,茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册" /> |
|||
<link rel="stylesheet" href="../skin/css/font-awesome.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/bootstrap.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/owl.carousel.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/lightbox.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/masterslider.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/main.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/tk.css" type="text/css"/> |
|||
<script type="text/javascript" src="../skin/js/modernizr-custom.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery-1.11.3.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap.min.js"></script> |
|||
<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. --> |
|||
<!--[if lt IE 9]> |
|||
<script src="../skin/js/html5.js"></script> |
|||
<script src="../skin/js/respond.min.js"></script> |
|||
<style> |
|||
article,aside,dialog,footer,header,section,nav,figure,menu{display:block;padding:0;margin:0;} |
|||
</style> |
|||
<link rel="stylesheet" href="../skin/css/ie.css" type="text/css" media="screen"/> |
|||
<![endif]--> |
|||
|
|||
<!--[if lte IE 9]> |
|||
<script src="../skin/js/jquery.placeholder.js"></script> |
|||
<script> |
|||
jQuery(document).ready(function($){ |
|||
$('input, textarea').placeholder(); |
|||
}); |
|||
</script> |
|||
<script type="text/javascript" src="../skin/js/pie.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($){ |
|||
$('.indexci img').each(function() { |
|||
PIE.attach(this); |
|||
}); |
|||
}); |
|||
</script> |
|||
<![endif]--> |
|||
<!--[if (gte IE 6)&(lte IE 8)]> |
|||
<script type="text/javascript" src="../skin/js/selectivizr.js"></script> |
|||
<script type="text/javascript" src="../skin/js/excanvas.compiled.js"></script> |
|||
<![endif]--> |
|||
<style> |
|||
.menuItem{ |
|||
width: 100%; |
|||
font-size: 16px; |
|||
cursor: pointer; |
|||
padding: 0 10px; |
|||
font-weight: bold; |
|||
position: relative; |
|||
background: #B2B2B2; |
|||
} |
|||
|
|||
.menuIcon{ |
|||
top: 50%; |
|||
right: 8%; |
|||
position: absolute; |
|||
transform: translate(0,-50%); |
|||
} |
|||
|
|||
.menuImg{ |
|||
width: 20px; |
|||
height: 20px; |
|||
} |
|||
|
|||
.menuItemSpan{ |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 12px 0 10px 0; |
|||
justify-content: center; |
|||
border-bottom: 1px solid #8D8D8D; |
|||
} |
|||
|
|||
.menuBottom{ |
|||
display: flex; |
|||
padding: 35px 0; |
|||
font-size: 12px; |
|||
font-weight: bold; |
|||
align-items: center; |
|||
background: #808080; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.menuBottomSpan{ |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<!--[if lt IE 8]> |
|||
<div class="lt-ie8-bg"> |
|||
<p class="browsehappy">You are using an <strong>outdated</strong> browser.</p> |
|||
<p>Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> |
|||
<p class="browsehappy">对不起，您正在使用的是 <strong>过时</strong> 的浏览器.</p> |
|||
<p>请升级您的浏览器（IE8+，或者是火狐、谷歌、Opera、Safari等现代浏览器），以改进您的用户体验！</p> |
|||
</div> |
|||
<style> |
|||
.lt-ie8-bg{z-index:11111;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#333;color:#999;padding:100px 20px;text-align:center;font-size:26px} |
|||
.lt-ie8-bg a{color:#f5f5f5;border-bottom:2px solid #fff} |
|||
.lt-ie8-bg a:hover{text-decoration:none} |
|||
#page-body-wrap{display:none;} |
|||
</style> |
|||
<![endif]--> |
|||
<div id="page-body-wrap"> |
|||
|
|||
<header class="page-header"> |
|||
<nav class="navbar navbar-default clearfix" style="background-color:#0824f8"> |
|||
<div class="container"> |
|||
<a class="navbar-toggle collapsed mmenu-btn" href="#mmenu"><i class="fa fa-reorder"></i></a> |
|||
<img src="../skin/images/logo.png" style="width:131.19px;height:40.58px;margin-top: 15px;"/> |
|||
<div class="main-navigation-wrapper" id="main-nav"> |
|||
<div class="collapse navbar-collapse" id="navbar-collapse"> |
|||
<ul class="nav navbar-nav main-navigation clearfix"> |
|||
<li > <a class="menu1" href="../index.html">首页</a></li> |
|||
<!-- <li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./about/index.html" class="menu1">公司简介 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./about/jianjie/" class="menu2">公司简介</a> </li> |
|||
<li class="Lev2"> <a href="./about/pinpai/" class="menu2">品牌起源</a> </li> |
|||
<li class="Lev2"> <a href="./about/xiangce/" class="menu2">公司相册</a> </li> |
|||
</ul> |
|||
</li> |
|||
<li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./product/index.html" class="menu1">产品中心 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./product/p1/" class="menu2">彩妆产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p2/" class="menu2">护肤产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p3/" class="menu2">美甲产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p4/" class="menu2">流行饰品</a> </li> |
|||
</ul> |
|||
</li> --> |
|||
<li class="Lev1 dropdown "> <a href="../about/index.html" class="menu1">公司简介</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../product/index.html" class="menu1">产品中心</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../case/index.html" class="menu1">厂房展示</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../news/index.html" class="menu1">新闻中心 </a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../contact/index.html" class="menu1">联系我们</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</nav> |
|||
</header> |
|||
|
|||
<div style="display: flex;background: #e3e3e3"> |
|||
<div style="width: 15%"> |
|||
<ul id="menu"> |
|||
<li class="menuItem" style="background: #808080"> |
|||
<span class="menuItemSpan"> |
|||
新闻中心 |
|||
</span> |
|||
<span class="glyphicon glyphicon-menu-down menuIcon"></span> |
|||
</li> |
|||
</ul> |
|||
<div class="menuBottom"> |
|||
<div class="menuBottomSpan" style="margin-bottom: 5px">广州普睿特智能包装有限公司</div> |
|||
<div class="menuBottomSpan">广州市天河区思成路宏太智慧谷3号楼4号楼</div> |
|||
</div> |
|||
</div> |
|||
<div id="content" style="flex: 1 0 auto;display: flex; align-items: center; justify-content: center;padding: 45px 0;"> |
|||
<div id="contentItem1"> |
|||
公司动态 |
|||
</div> |
|||
<div id="contentItem2"> |
|||
行业资讯 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<footer class="page-footer" id="footer-sec"> |
|||
<div class="scroll-top-container" style="padding-bottom: 80px"> |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-md-3 col-sm-12 footer-col foot-about" style="width:35%"> <h6 class="bottom-line-alt dark-title"><a href="./about/index.html">关于我们</a></h6> |
|||
<div class="f-about"> |
|||
<div class="fabout-text" style="color:white;padding-bottom: 100px"> |
|||
<p> 普瑞特是千鸟互联旗下控股子公司，面向各类品牌客户，拟运用物联网、云计算、大数据和人工智能等高新科技打造生产纸包装产品的共享智能云工厂，以“产业互联网+产能共享+智能云工厂”等三维一体模式打造印刷包装行业“AIOT+MES+实体数字工厂”的现代化智能制造工厂，实现高效的柔性生产、远程跟单和敏捷交付，进行精细化管理和集约化生产，达到生产效率更高、产能利用率更大、综合成本更低的纸包装生产交付能力升级。</p> |
|||
</div> |
|||
<a href="../about/index.html" class="read-more-link" style="margin-top: 120px">了解更多</a> |
|||
</div> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-nav" style="padding-left: 180px;width:39%"> |
|||
<h6 class="bottom-line-alt">快速导航</h6> |
|||
<ul class="list-links"> |
|||
<li><a href="../index.html">首页</a></li> |
|||
<li><a href="../about/index.html">公司简介</a></li> |
|||
<li><a href="../product/index.html">产品中心</a></li> |
|||
<li><a href="../case/index.html">厂房展示</a></li> |
|||
<li><a href="../news/index.html">新闻中心</a></li> |
|||
<li><a href="../contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-qrocde"> |
|||
<h6 class="bottom-line-alt">关注我们</h6> |
|||
<div class="f-qrcode"> <img src="../skin/images/qrcode.png" width="336px" height="336px" /> </div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- <div id="scroll-top"></div> --> |
|||
</div> |
|||
<div class="site-info"> |
|||
<div class="container clearfix"> |
|||
<div class="site-info-left" style="width:100%;text-align:center;color:white;"> Copyright © 2022-2024 广州普睿特智能包装科技有限公司 版权所有 粤ICP备2022094124号</a></div> |
|||
</div> |
|||
</div> |
|||
</footer> |
|||
</div> |
|||
<script type="text/javascript" src="../skin/js/owl.carousel.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/lightbox.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.easing.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/masterslider.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.scrollto.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.stellar.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/isotope.pkgd.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap-hover-dropdown.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/custom.js"></script> |
|||
<nav id="mmenu" class="noDis"> |
|||
<div class="mmDiv"> |
|||
<div class="MMhead"> <a href="#mm-0" class="closemenu noblock">X</a> <!--<a href="" target="_blank" class="noblock">English</a>--> </div> |
|||
<ul> |
|||
<li class="m-Lev1"><a href="./index.html">首页</a></li> |
|||
<li class="m-Lev1"><a href="./about/index.html">公司简介</a></li> |
|||
<li class="m-Lev1"><a href="./product/index.html">产品中心</a></li> |
|||
<li class="m-Lev1"><a href="./case/index.html">厂房展示</a></li> |
|||
<li class="m-Lev1"><a href="./news/index.html">新闻中心</a></li> |
|||
<li class="m-Lev1"><a href="./contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
</nav> |
|||
<link type="text/css" rel="stylesheet" href="../skin/css/jquery.mmenu.all.css" /> |
|||
<script type="text/javascript" src="../skin/js/jquery.mmenu.all.min.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($) { |
|||
var mmenu=$('nav#mmenu').mmenu({ |
|||
slidingSubmenus: true, |
|||
classes : 'mm-white', //mm-fullscreen mm-light |
|||
extensions : [ "theme-white" ], |
|||
offCanvas : { |
|||
position: "right", //left, top, right, bottom |
|||
zposition: "front" //back, front,next |
|||
//modal : true |
|||
}, |
|||
searchfield : false, |
|||
counters : false, |
|||
//navbars : { |
|||
//content : [ "prev", "title", "next" ] |
|||
//}, |
|||
navbar : { |
|||
title : "网站导航" |
|||
}, |
|||
header : { |
|||
add : true, |
|||
update : true, |
|||
title : "网站导航" |
|||
} |
|||
}); |
|||
$(".closemenu").click(function() { |
|||
var mmenuAPI = $("#mmenu").data( "mmenu" ); |
|||
mmenuAPI.close(); |
|||
}); |
|||
}); |
|||
|
|||
const menuList = ['公司动态','行业资讯']; |
|||
const menu = document.getElementById('menu'); |
|||
// li里面嵌一层div，制造border左右缩进效果 |
|||
for (let i = 0; i < menuList.length; i++) { |
|||
const item = menuList[i]; |
|||
const liEle = document.createElement('li'); |
|||
const spanEle = document.createElement('span'); |
|||
const iconEle = document.createElement('img') |
|||
iconEle.src = '../skin/images/rhombus.png'; |
|||
iconEle.className = 'menuIcon menuImg'; |
|||
iconEle.id = 'menuIcon' + (i + 1); |
|||
spanEle.innerHTML = item; |
|||
spanEle.className = "menuItemSpan"; |
|||
liEle.className = "menuItem"; |
|||
liEle.setAttribute('data-index',i + '') |
|||
liEle.appendChild(spanEle); |
|||
liEle.appendChild(iconEle); |
|||
liEle.addEventListener('click',()=>{ |
|||
init(i) |
|||
}) |
|||
menu.appendChild(liEle) |
|||
} |
|||
|
|||
function init(i = 0){ |
|||
const content = document.getElementById('content'); |
|||
const children = content.children; |
|||
// 先把所有contentItem元素隐藏 |
|||
for (let j = 0; j < children.length; j++) { |
|||
const contentItem = children[j]; |
|||
contentItem.style.display = 'none' |
|||
} |
|||
// 再获取到目标contentItem元素展示 |
|||
const target = document.getElementById('contentItem' + (i + 1)) |
|||
target.style.display = 'inline' |
|||
// 再获取到所有的menuImg，将他们的图标替换为默认的 |
|||
const menuImgList = document.getElementsByClassName('menuImg'); |
|||
for (let j = 0; j < menuImgList.length; j++) { |
|||
const menuImg = menuImgList[j]; |
|||
menuImg.src = '../skin/images/rhombus.png' |
|||
} |
|||
// 在获取到目标menuImg，更改他的图标为选中图标 |
|||
const targetMenuImg = document.getElementById('menuIcon' + (i + 1)); |
|||
targetMenuImg.src = '../skin/images/rhombus_black.png' |
|||
} |
|||
|
|||
init() |
|||
</script> |
|||
</body> |
|||
</html> |
|||
@ -0,0 +1,325 @@ |
|||
<!DOCTYPE html> |
|||
<!--[if IE 7 ]> <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]--> |
|||
<!--[if IE 8 ]> <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]--> |
|||
<!--[if IE 9 ]> <html lang="en-gb" class="isie ie9 no-js"> <![endif]--> |
|||
<!--[if (gt IE 9)|!(IE)]><!--> |
|||
<html class="no-js"> |
|||
<!--<![endif]--> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|||
<meta name="renderer" content="webkit" /> |
|||
<meta name="robots" content="index, follow" /> |
|||
<title>普睿特—智能包装云工厂</title> |
|||
<meta name="description" content="普睿特—智能包装云工厂，是广州印刷厂，提供印刷、包装等服务，包括茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册等业务，品质稳定,价格合理,交付准时,量身定制包装盒系统方案。" /> |
|||
<meta name="keywords" content="普睿特,广州印刷,印刷,包装,茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册" /> |
|||
<link rel="stylesheet" href="../skin/css/font-awesome.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/bootstrap.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/owl.carousel.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/lightbox.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/masterslider.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/main.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/tk.css" type="text/css"/> |
|||
<script type="text/javascript" src="../skin/js/modernizr-custom.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery-1.11.3.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap.min.js"></script> |
|||
<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. --> |
|||
<!--[if lt IE 9]> |
|||
<script src="../skin/js/html5.js"></script> |
|||
<script src="../skin/js/respond.min.js"></script> |
|||
<style> |
|||
article,aside,dialog,footer,header,section,nav,figure,menu{display:block;padding:0;margin:0;} |
|||
</style> |
|||
<link rel="stylesheet" href="../skin/css/ie.css" type="text/css" media="screen"/> |
|||
<![endif]--> |
|||
|
|||
<!--[if lte IE 9]> |
|||
<script src="../skin/js/jquery.placeholder.js"></script> |
|||
<script> |
|||
jQuery(document).ready(function($){ |
|||
$('input, textarea').placeholder(); |
|||
}); |
|||
</script> |
|||
<script type="text/javascript" src="../skin/js/pie.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($){ |
|||
$('.indexci img').each(function() { |
|||
PIE.attach(this); |
|||
}); |
|||
}); |
|||
</script> |
|||
<![endif]--> |
|||
<!--[if (gte IE 6)&(lte IE 8)]> |
|||
<script type="text/javascript" src="../skin/js/selectivizr.js"></script> |
|||
<script type="text/javascript" src="../skin/js/excanvas.compiled.js"></script> |
|||
<![endif]--> |
|||
<style> |
|||
.menuItem{ |
|||
width: 100%; |
|||
font-size: 16px; |
|||
cursor: pointer; |
|||
padding: 0 10px; |
|||
font-weight: bold; |
|||
position: relative; |
|||
background: #B2B2B2; |
|||
} |
|||
|
|||
.menuIcon{ |
|||
top: 50%; |
|||
right: 8%; |
|||
position: absolute; |
|||
transform: translate(0,-50%); |
|||
} |
|||
|
|||
.menuImg{ |
|||
width: 20px; |
|||
height: 20px; |
|||
} |
|||
|
|||
.menuItemSpan{ |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 12px 0 10px 0; |
|||
justify-content: center; |
|||
border-bottom: 1px solid #8D8D8D; |
|||
} |
|||
|
|||
.menuBottom{ |
|||
display: flex; |
|||
padding: 35px 0; |
|||
font-size: 12px; |
|||
font-weight: bold; |
|||
align-items: center; |
|||
background: #808080; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.menuBottomSpan{ |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<!--[if lt IE 8]> |
|||
<div class="lt-ie8-bg"> |
|||
<p class="browsehappy">You are using an <strong>outdated</strong> browser.</p> |
|||
<p>Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> |
|||
<p class="browsehappy">对不起，您正在使用的是 <strong>过时</strong> 的浏览器.</p> |
|||
<p>请升级您的浏览器（IE8+，或者是火狐、谷歌、Opera、Safari等现代浏览器），以改进您的用户体验！</p> |
|||
</div> |
|||
<style> |
|||
.lt-ie8-bg{z-index:11111;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#333;color:#999;padding:100px 20px;text-align:center;font-size:26px} |
|||
.lt-ie8-bg a{color:#f5f5f5;border-bottom:2px solid #fff} |
|||
.lt-ie8-bg a:hover{text-decoration:none} |
|||
#page-body-wrap{display:none;} |
|||
</style> |
|||
<![endif]--> |
|||
<div id="page-body-wrap"> |
|||
|
|||
<header class="page-header"> |
|||
<nav class="navbar navbar-default clearfix" style="background-color:#0824f8"> |
|||
<div class="container"> |
|||
<a class="navbar-toggle collapsed mmenu-btn" href="#mmenu"><i class="fa fa-reorder"></i></a> |
|||
<img src="../skin/images/logo.png" style="width:131.19px;height:40.58px;margin-top: 15px;"/> |
|||
<div class="main-navigation-wrapper" id="main-nav"> |
|||
<div class="collapse navbar-collapse" id="navbar-collapse"> |
|||
<ul class="nav navbar-nav main-navigation clearfix"> |
|||
<li > <a class="menu1" href="../index.html">首页</a></li> |
|||
<!-- <li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./about/index.html" class="menu1">公司简介 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./about/jianjie/" class="menu2">公司简介</a> </li> |
|||
<li class="Lev2"> <a href="./about/pinpai/" class="menu2">品牌起源</a> </li> |
|||
<li class="Lev2"> <a href="./about/xiangce/" class="menu2">公司相册</a> </li> |
|||
</ul> |
|||
</li> |
|||
<li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./product/index.html" class="menu1">产品中心 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./product/p1/" class="menu2">彩妆产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p2/" class="menu2">护肤产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p3/" class="menu2">美甲产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p4/" class="menu2">流行饰品</a> </li> |
|||
</ul> |
|||
</li> --> |
|||
<li class="Lev1 dropdown "> <a href="../about/index.html" class="menu1">公司简介</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../product/index.html" class="menu1">产品中心</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../case/index.html" class="menu1">厂房展示</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../news/index.html" class="menu1">新闻中心 </a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../contact/index.html" class="menu1">联系我们</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</nav> |
|||
</header> |
|||
|
|||
<div style="display: flex;background: #e3e3e3"> |
|||
<div style="width: 15%"> |
|||
<ul id="menu"> |
|||
<li class="menuItem" style="background: #808080"> |
|||
<span class="menuItemSpan"> |
|||
新闻中心 |
|||
</span> |
|||
<span class="glyphicon glyphicon-menu-down menuIcon"></span> |
|||
</li> |
|||
</ul> |
|||
<div class="menuBottom"> |
|||
<div class="menuBottomSpan" style="margin-bottom: 5px">广州普睿特智能包装有限公司</div> |
|||
<div class="menuBottomSpan">广州市天河区思成路宏太智慧谷3号楼4号楼</div> |
|||
</div> |
|||
</div> |
|||
<div id="content" style="flex: 1 0 auto;display: flex; align-items: center; justify-content: center;padding: 45px 0;"> |
|||
<div id="contentItem1"> |
|||
公司动态 |
|||
</div> |
|||
<div id="contentItem2"> |
|||
行业资讯 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<footer class="page-footer" id="footer-sec"> |
|||
<div class="scroll-top-container" style="padding-bottom: 80px"> |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-md-3 col-sm-12 footer-col foot-about" style="width:35%"> <h6 class="bottom-line-alt dark-title"><a href="./about/index.html">关于我们</a></h6> |
|||
<div class="f-about"> |
|||
<div class="fabout-text" style="color:white;padding-bottom: 100px"> |
|||
<p> 普瑞特是千鸟互联旗下控股子公司，面向各类品牌客户，拟运用物联网、云计算、大数据和人工智能等高新科技打造生产纸包装产品的共享智能云工厂，以“产业互联网+产能共享+智能云工厂”等三维一体模式打造印刷包装行业“AIOT+MES+实体数字工厂”的现代化智能制造工厂，实现高效的柔性生产、远程跟单和敏捷交付，进行精细化管理和集约化生产，达到生产效率更高、产能利用率更大、综合成本更低的纸包装生产交付能力升级。</p> |
|||
</div> |
|||
<a href="../about/index.html" class="read-more-link" style="margin-top: 120px">了解更多</a> |
|||
</div> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-nav" style="padding-left: 180px;width:39%"> |
|||
<h6 class="bottom-line-alt">快速导航</h6> |
|||
<ul class="list-links"> |
|||
<li><a href="../index.html">首页</a></li> |
|||
<li><a href="../about/index.html">公司简介</a></li> |
|||
<li><a href="../product/index.html">产品中心</a></li> |
|||
<li><a href="../case/index.html">厂房展示</a></li> |
|||
<li><a href="../news/index.html">新闻中心</a></li> |
|||
<li><a href="../contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-qrocde"> |
|||
<h6 class="bottom-line-alt">关注我们</h6> |
|||
<div class="f-qrcode"> <img src="../skin/images/qrcode.png" width="336px" height="336px" /> </div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- <div id="scroll-top"></div> --> |
|||
</div> |
|||
<div class="site-info"> |
|||
<div class="container clearfix"> |
|||
<div class="site-info-left" style="width:100%;text-align:center;color:white;"> Copyright © 2022-2024 广州普睿特智能包装科技有限公司 版权所有 粤ICP备2022094124号</a></div> |
|||
</div> |
|||
</div> |
|||
</footer> |
|||
</div> |
|||
<script type="text/javascript" src="../skin/js/owl.carousel.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/lightbox.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.easing.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/masterslider.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.scrollto.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.stellar.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/isotope.pkgd.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap-hover-dropdown.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/custom.js"></script> |
|||
<nav id="mmenu" class="noDis"> |
|||
<div class="mmDiv"> |
|||
<div class="MMhead"> <a href="#mm-0" class="closemenu noblock">X</a> <!--<a href="" target="_blank" class="noblock">English</a>--> </div> |
|||
<ul> |
|||
<li class="m-Lev1"><a href="./index.html">首页</a></li> |
|||
<li class="m-Lev1"><a href="./about/index.html">公司简介</a></li> |
|||
<li class="m-Lev1"><a href="./product/index.html">产品中心</a></li> |
|||
<li class="m-Lev1"><a href="./case/index.html">厂房展示</a></li> |
|||
<li class="m-Lev1"><a href="./news/index.html">新闻中心</a></li> |
|||
<li class="m-Lev1"><a href="./contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
</nav> |
|||
<link type="text/css" rel="stylesheet" href="../skin/css/jquery.mmenu.all.css" /> |
|||
<script type="text/javascript" src="../skin/js/jquery.mmenu.all.min.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($) { |
|||
var mmenu=$('nav#mmenu').mmenu({ |
|||
slidingSubmenus: true, |
|||
classes : 'mm-white', //mm-fullscreen mm-light |
|||
extensions : [ "theme-white" ], |
|||
offCanvas : { |
|||
position: "right", //left, top, right, bottom |
|||
zposition: "front" //back, front,next |
|||
//modal : true |
|||
}, |
|||
searchfield : false, |
|||
counters : false, |
|||
//navbars : { |
|||
//content : [ "prev", "title", "next" ] |
|||
//}, |
|||
navbar : { |
|||
title : "网站导航" |
|||
}, |
|||
header : { |
|||
add : true, |
|||
update : true, |
|||
title : "网站导航" |
|||
} |
|||
}); |
|||
$(".closemenu").click(function() { |
|||
var mmenuAPI = $("#mmenu").data( "mmenu" ); |
|||
mmenuAPI.close(); |
|||
}); |
|||
}); |
|||
|
|||
const menuList = ['公司动态','行业资讯']; |
|||
const menu = document.getElementById('menu'); |
|||
// li里面嵌一层div，制造border左右缩进效果 |
|||
for (let i = 0; i < menuList.length; i++) { |
|||
const item = menuList[i]; |
|||
const liEle = document.createElement('li'); |
|||
const spanEle = document.createElement('span'); |
|||
const iconEle = document.createElement('img') |
|||
iconEle.src = '../skin/images/rhombus.png'; |
|||
iconEle.className = 'menuIcon menuImg'; |
|||
iconEle.id = 'menuIcon' + (i + 1); |
|||
spanEle.innerHTML = item; |
|||
spanEle.className = "menuItemSpan"; |
|||
liEle.className = "menuItem"; |
|||
liEle.setAttribute('data-index',i + '') |
|||
liEle.appendChild(spanEle); |
|||
liEle.appendChild(iconEle); |
|||
liEle.addEventListener('click',()=>{ |
|||
init(i) |
|||
}) |
|||
menu.appendChild(liEle) |
|||
} |
|||
|
|||
function init(i = 0){ |
|||
const content = document.getElementById('content'); |
|||
const children = content.children; |
|||
// 先把所有contentItem元素隐藏 |
|||
for (let j = 0; j < children.length; j++) { |
|||
const contentItem = children[j]; |
|||
contentItem.style.display = 'none' |
|||
} |
|||
// 再获取到目标contentItem元素展示 |
|||
const target = document.getElementById('contentItem' + (i + 1)) |
|||
target.style.display = 'inline' |
|||
// 再获取到所有的menuImg，将他们的图标替换为默认的 |
|||
const menuImgList = document.getElementsByClassName('menuImg'); |
|||
for (let j = 0; j < menuImgList.length; j++) { |
|||
const menuImg = menuImgList[j]; |
|||
menuImg.src = '../skin/images/rhombus.png' |
|||
} |
|||
// 在获取到目标menuImg，更改他的图标为选中图标 |
|||
const targetMenuImg = document.getElementById('menuIcon' + (i + 1)); |
|||
targetMenuImg.src = '../skin/images/rhombus_black.png' |
|||
} |
|||
|
|||
init() |
|||
</script> |
|||
</body> |
|||
</html> |
|||
@ -0,0 +1,325 @@ |
|||
<!DOCTYPE html> |
|||
<!--[if IE 7 ]> <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]--> |
|||
<!--[if IE 8 ]> <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]--> |
|||
<!--[if IE 9 ]> <html lang="en-gb" class="isie ie9 no-js"> <![endif]--> |
|||
<!--[if (gt IE 9)|!(IE)]><!--> |
|||
<html class="no-js"> |
|||
<!--<![endif]--> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|||
<meta name="renderer" content="webkit" /> |
|||
<meta name="robots" content="index, follow" /> |
|||
<title>普睿特—智能包装云工厂</title> |
|||
<meta name="description" content="普睿特—智能包装云工厂，是广州印刷厂，提供印刷、包装等服务，包括茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册等业务，品质稳定,价格合理,交付准时,量身定制包装盒系统方案。" /> |
|||
<meta name="keywords" content="普睿特,广州印刷,印刷,包装,茶叶包装盒,酒类包装盒,医疗保健包装盒,美妆护肤包装盒,3C数码包装盒,节日礼盒,礼品袋,纸箱包装盒,书刊画册" /> |
|||
<link rel="stylesheet" href="../skin/css/font-awesome.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/bootstrap.min.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/owl.carousel.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/lightbox.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/masterslider.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/main.css" type="text/css"/> |
|||
<link rel="stylesheet" href="../skin/css/tk.css" type="text/css"/> |
|||
<script type="text/javascript" src="../skin/js/modernizr-custom.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery-1.11.3.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap.min.js"></script> |
|||
<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. --> |
|||
<!--[if lt IE 9]> |
|||
<script src="../skin/js/html5.js"></script> |
|||
<script src="../skin/js/respond.min.js"></script> |
|||
<style> |
|||
article,aside,dialog,footer,header,section,nav,figure,menu{display:block;padding:0;margin:0;} |
|||
</style> |
|||
<link rel="stylesheet" href="../skin/css/ie.css" type="text/css" media="screen"/> |
|||
<![endif]--> |
|||
|
|||
<!--[if lte IE 9]> |
|||
<script src="../skin/js/jquery.placeholder.js"></script> |
|||
<script> |
|||
jQuery(document).ready(function($){ |
|||
$('input, textarea').placeholder(); |
|||
}); |
|||
</script> |
|||
<script type="text/javascript" src="../skin/js/pie.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($){ |
|||
$('.indexci img').each(function() { |
|||
PIE.attach(this); |
|||
}); |
|||
}); |
|||
</script> |
|||
<![endif]--> |
|||
<!--[if (gte IE 6)&(lte IE 8)]> |
|||
<script type="text/javascript" src="../skin/js/selectivizr.js"></script> |
|||
<script type="text/javascript" src="../skin/js/excanvas.compiled.js"></script> |
|||
<![endif]--> |
|||
<style> |
|||
.menuItem{ |
|||
width: 100%; |
|||
font-size: 16px; |
|||
cursor: pointer; |
|||
padding: 0 10px; |
|||
font-weight: bold; |
|||
position: relative; |
|||
background: #B2B2B2; |
|||
} |
|||
|
|||
.menuIcon{ |
|||
top: 50%; |
|||
right: 8%; |
|||
position: absolute; |
|||
transform: translate(0,-50%); |
|||
} |
|||
|
|||
.menuImg{ |
|||
width: 20px; |
|||
height: 20px; |
|||
} |
|||
|
|||
.menuItemSpan{ |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 12px 0 10px 0; |
|||
justify-content: center; |
|||
border-bottom: 1px solid #8D8D8D; |
|||
} |
|||
|
|||
.menuBottom{ |
|||
display: flex; |
|||
padding: 35px 0; |
|||
font-size: 12px; |
|||
font-weight: bold; |
|||
align-items: center; |
|||
background: #808080; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.menuBottomSpan{ |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<!--[if lt IE 8]> |
|||
<div class="lt-ie8-bg"> |
|||
<p class="browsehappy">You are using an <strong>outdated</strong> browser.</p> |
|||
<p>Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> |
|||
<p class="browsehappy">对不起，您正在使用的是 <strong>过时</strong> 的浏览器.</p> |
|||
<p>请升级您的浏览器（IE8+，或者是火狐、谷歌、Opera、Safari等现代浏览器），以改进您的用户体验！</p> |
|||
</div> |
|||
<style> |
|||
.lt-ie8-bg{z-index:11111;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#333;color:#999;padding:100px 20px;text-align:center;font-size:26px} |
|||
.lt-ie8-bg a{color:#f5f5f5;border-bottom:2px solid #fff} |
|||
.lt-ie8-bg a:hover{text-decoration:none} |
|||
#page-body-wrap{display:none;} |
|||
</style> |
|||
<![endif]--> |
|||
<div id="page-body-wrap"> |
|||
|
|||
<header class="page-header"> |
|||
<nav class="navbar navbar-default clearfix" style="background-color:#0824f8"> |
|||
<div class="container"> |
|||
<a class="navbar-toggle collapsed mmenu-btn" href="#mmenu"><i class="fa fa-reorder"></i></a> |
|||
<img src="../skin/images/logo.png" style="width:131.19px;height:40.58px;margin-top: 15px;"/> |
|||
<div class="main-navigation-wrapper" id="main-nav"> |
|||
<div class="collapse navbar-collapse" id="navbar-collapse"> |
|||
<ul class="nav navbar-nav main-navigation clearfix"> |
|||
<li > <a class="menu1" href="../index.html">首页</a></li> |
|||
<!-- <li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./about/index.html" class="menu1">公司简介 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./about/jianjie/" class="menu2">公司简介</a> </li> |
|||
<li class="Lev2"> <a href="./about/pinpai/" class="menu2">品牌起源</a> </li> |
|||
<li class="Lev2"> <a href="./about/xiangce/" class="menu2">公司相册</a> </li> |
|||
</ul> |
|||
</li> |
|||
<li class="Lev1 dropdown "> <a class="menu1 dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="./product/index.html" class="menu1">产品中心 |
|||
<i class="fa fa-caret-down"></i> </a> |
|||
<ul class="dropdown-menu sub-menu2" role="menu"> |
|||
<li class="Lev2"> <a href="./product/p1/" class="menu2">彩妆产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p2/" class="menu2">护肤产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p3/" class="menu2">美甲产品</a> </li> |
|||
<li class="Lev2"> <a href="./product/p4/" class="menu2">流行饰品</a> </li> |
|||
</ul> |
|||
</li> --> |
|||
<li class="Lev1 dropdown "> <a href="../about/index.html" class="menu1">公司简介</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../product/index.html" class="menu1">产品中心</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../case/index.html" class="menu1">厂房展示</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../news/index.html" class="menu1">新闻中心 </a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
<li class="Lev1 dropdown "> <a href="../contact/index.html" class="menu1">联系我们</a><ul class="dropdown-menu sub-menu2" role="menu"></ul></li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</nav> |
|||
</header> |
|||
|
|||
<div style="display: flex;background: #e3e3e3"> |
|||
<div style="width: 15%"> |
|||
<ul id="menu"> |
|||
<li class="menuItem" style="background: #808080"> |
|||
<span class="menuItemSpan"> |
|||
新闻中心 |
|||
</span> |
|||
<span class="glyphicon glyphicon-menu-down menuIcon"></span> |
|||
</li> |
|||
</ul> |
|||
<div class="menuBottom"> |
|||
<div class="menuBottomSpan" style="margin-bottom: 5px">广州普睿特智能包装有限公司</div> |
|||
<div class="menuBottomSpan">广州市天河区思成路宏太智慧谷3号楼4号楼</div> |
|||
</div> |
|||
</div> |
|||
<div id="content" style="flex: 1 0 auto;display: flex; align-items: center; justify-content: center;padding: 45px 0;"> |
|||
<div id="contentItem1"> |
|||
公司动态 |
|||
</div> |
|||
<div id="contentItem2"> |
|||
行业资讯 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<footer class="page-footer" id="footer-sec"> |
|||
<div class="scroll-top-container" style="padding-bottom: 80px"> |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-md-3 col-sm-12 footer-col foot-about" style="width:35%"> <h6 class="bottom-line-alt dark-title"><a href="./about/index.html">关于我们</a></h6> |
|||
<div class="f-about"> |
|||
<div class="fabout-text" style="color:white;padding-bottom: 100px"> |
|||
<p> 普瑞特是千鸟互联旗下控股子公司，面向各类品牌客户，拟运用物联网、云计算、大数据和人工智能等高新科技打造生产纸包装产品的共享智能云工厂，以“产业互联网+产能共享+智能云工厂”等三维一体模式打造印刷包装行业“AIOT+MES+实体数字工厂”的现代化智能制造工厂，实现高效的柔性生产、远程跟单和敏捷交付，进行精细化管理和集约化生产，达到生产效率更高、产能利用率更大、综合成本更低的纸包装生产交付能力升级。</p> |
|||
</div> |
|||
<a href="../about/index.html" class="read-more-link" style="margin-top: 120px">了解更多</a> |
|||
</div> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-nav" style="padding-left: 180px;width:39%"> |
|||
<h6 class="bottom-line-alt">快速导航</h6> |
|||
<ul class="list-links"> |
|||
<li><a href="../index.html">首页</a></li> |
|||
<li><a href="../about/index.html">公司简介</a></li> |
|||
<li><a href="../product/index.html">产品中心</a></li> |
|||
<li><a href="../case/index.html">厂房展示</a></li> |
|||
<li><a href="../news/index.html">新闻中心</a></li> |
|||
<li><a href="../contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
<div class="col-md-3 col-sm-6 hidden-sm hidden-xs footer-col foot-qrocde"> |
|||
<h6 class="bottom-line-alt">关注我们</h6> |
|||
<div class="f-qrcode"> <img src="../skin/images/qrcode.png" width="336px" height="336px" /> </div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- <div id="scroll-top"></div> --> |
|||
</div> |
|||
<div class="site-info"> |
|||
<div class="container clearfix"> |
|||
<div class="site-info-left" style="width:100%;text-align:center;color:white;"> Copyright © 2022-2024 广州普睿特智能包装科技有限公司 版权所有 粤ICP备2022094124号</a></div> |
|||
</div> |
|||
</div> |
|||
</footer> |
|||
</div> |
|||
<script type="text/javascript" src="../skin/js/owl.carousel.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/lightbox.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.easing.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/masterslider.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.scrollto.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/jquery.stellar.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/isotope.pkgd.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/bootstrap-hover-dropdown.min.js"></script> |
|||
<script type="text/javascript" src="../skin/js/custom.js"></script> |
|||
<nav id="mmenu" class="noDis"> |
|||
<div class="mmDiv"> |
|||
<div class="MMhead"> <a href="#mm-0" class="closemenu noblock">X</a> <!--<a href="" target="_blank" class="noblock">English</a>--> </div> |
|||
<ul> |
|||
<li class="m-Lev1"><a href="./index.html">首页</a></li> |
|||
<li class="m-Lev1"><a href="./about/index.html">公司简介</a></li> |
|||
<li class="m-Lev1"><a href="./product/index.html">产品中心</a></li> |
|||
<li class="m-Lev1"><a href="./case/index.html">厂房展示</a></li> |
|||
<li class="m-Lev1"><a href="./news/index.html">新闻中心</a></li> |
|||
<li class="m-Lev1"><a href="./contact/index.html">联系我们</a></li> |
|||
</ul> |
|||
</div> |
|||
</nav> |
|||
<link type="text/css" rel="stylesheet" href="../skin/css/jquery.mmenu.all.css" /> |
|||
<script type="text/javascript" src="../skin/js/jquery.mmenu.all.min.js"></script> |
|||
<script type="text/javascript"> |
|||
jQuery(document).ready(function($) { |
|||
var mmenu=$('nav#mmenu').mmenu({ |
|||
slidingSubmenus: true, |
|||
classes : 'mm-white', //mm-fullscreen mm-light |
|||
extensions : [ "theme-white" ], |
|||
offCanvas : { |
|||
position: "right", //left, top, right, bottom |
|||
zposition: "front" //back, front,next |
|||
//modal : true |
|||
}, |
|||
searchfield : false, |
|||
counters : false, |
|||
//navbars : { |
|||
//content : [ "prev", "title", "next" ] |
|||
//}, |
|||
navbar : { |
|||
title : "网站导航" |
|||
}, |
|||
header : { |
|||
add : true, |
|||
update : true, |
|||
title : "网站导航" |
|||
} |
|||
}); |
|||
$(".closemenu").click(function() { |
|||
var mmenuAPI = $("#mmenu").data( "mmenu" ); |
|||
mmenuAPI.close(); |
|||
}); |
|||
}); |
|||
|
|||
const menuList = ['公司动态','行业资讯']; |
|||
const menu = document.getElementById('menu'); |
|||
// li里面嵌一层div，制造border左右缩进效果 |
|||
for (let i = 0; i < menuList.length; i++) { |
|||
const item = menuList[i]; |
|||
const liEle = document.createElement('li'); |
|||
const spanEle = document.createElement('span'); |
|||
const iconEle = document.createElement('img') |
|||
iconEle.src = '../skin/images/rhombus.png'; |
|||
iconEle.className = 'menuIcon menuImg'; |
|||
iconEle.id = 'menuIcon' + (i + 1); |
|||
spanEle.innerHTML = item; |
|||
spanEle.className = "menuItemSpan"; |
|||
liEle.className = "menuItem"; |
|||
liEle.setAttribute('data-index',i + '') |
|||
liEle.appendChild(spanEle); |
|||
liEle.appendChild(iconEle); |
|||
liEle.addEventListener('click',()=>{ |
|||
init(i) |
|||
}) |
|||
menu.appendChild(liEle) |
|||
} |
|||
|
|||
function init(i = 0){ |
|||
const content = document.getElementById('content'); |
|||
const children = content.children; |
|||
// 先把所有contentItem元素隐藏 |
|||
for (let j = 0; j < children.length; j++) { |
|||
const contentItem = children[j]; |
|||
contentItem.style.display = 'none' |
|||
} |
|||
// 再获取到目标contentItem元素展示 |
|||
const target = document.getElementById('contentItem' + (i + 1)) |
|||
target.style.display = 'inline' |
|||
// 再获取到所有的menuImg，将他们的图标替换为默认的 |
|||
const menuImgList = document.getElementsByClassName('menuImg'); |
|||
for (let j = 0; j < menuImgList.length; j++) { |
|||
const menuImg = menuImgList[j]; |
|||
menuImg.src = '../skin/images/rhombus.png' |
|||
} |
|||
// 在获取到目标menuImg，更改他的图标为选中图标 |
|||
const targetMenuImg = document.getElementById('menuIcon' + (i + 1)); |
|||
targetMenuImg.src = '../skin/images/rhombus_black.png' |
|||
} |
|||
|
|||
init() |
|||
</script> |
|||
</body> |
|||
</html> |
|||
Write
Preview
Loading…
Cancel
Save