291 lines
14 KiB
HTML
291 lines
14 KiB
HTML
|
{layout name="layout" /}
|
||
|
|
|
||
|
|
<!-- 轮播图 -->
|
||
|
|
<div class="pull-banner w100">
|
||
|
|
<img src="{$category.src ?? '__STATIC__/images/banner/banner-about.jpg'}" alt="关于我们Banner">
|
||
|
|
<div class="pull-banner-title w1360">
|
||
|
|
<h2>{$category['title'] ?? '关于我们'}</h2>
|
||
|
|
<p>{$category['description'] ?? ''}</p>
|
||
|
|
<span><a href="index.html">首页</a> / {$category['title'] ?? '关于我们'} </span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- 二级导航 -->
|
||
|
|
<div class="pull-nav pull-nav-other w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<div class="pull-nav-bg pull-nav-bg2">
|
||
|
|
<div class="pull-nav-swiper swiper">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="survey-btn active">公司概况</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="course-btn">发展历程</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="strength-btn">制造实力</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="vision-btn">愿景使命</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="honor-btn">荣誉资质</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<a href="javascript:void(0);" rel="nofollow" class="social-btn">社会责任</a>
|
||
|
|
<ins></ins>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-button-prev"></div>
|
||
|
|
<div class="swiper-button-next"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- 主体内容 -->
|
||
|
|
<!-- 企业概况 -->
|
||
|
|
<div class="about-survey-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="survey">
|
||
|
|
<div class="about-survey w1360">
|
||
|
|
<div class="about-survey-content">
|
||
|
|
<div class="survey-txt">
|
||
|
|
<h3>{$blocks['company-title']['value'] ?? '河南华泰集团'}</h3>
|
||
|
|
<span>{:$blocks['company-description']['value'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
<ul class="survey-data">
|
||
|
|
<li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<span>公司年限</span>
|
||
|
|
<p><em class="data-number">{$blocks['time-limit-value']['value'] ?? 33}</em><span>年</span></p>
|
||
|
|
<span>{$blocks['time-limit-description']['value'] ?? ''}</span>
|
||
|
|
</li>
|
||
|
|
<li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<span>公司占地</span>
|
||
|
|
<p><em class="data-number">{$blocks['company-area']['value'] ?? 100000}</em></p>
|
||
|
|
<span>{$blocks['company-area-description']['value'] ?? '平方米工业厂房'}</span>
|
||
|
|
</li>
|
||
|
|
<li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<span>专利技术</span>
|
||
|
|
<p><em class="data-number">{$blocks['company-technology-num']['value'] ?? 56}</em><span>项</span></p>
|
||
|
|
<span>{$blocks['company-technology-description']['value'] ?? '国家专利'}</span>
|
||
|
|
</li>
|
||
|
|
<li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<span>产品出口</span>
|
||
|
|
<p><em class="data-number">{$blocks['company-export-num']['value'] ?? 50}</em><span>+</span></p>
|
||
|
|
<span>{$blocks['company-export-description']['value'] ?? '国家地区'}</span>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="about-survey-img wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<img src="{$blocks['company-description-img']['value'] ?? '__STATIC__/images/survey.jpg'}" alt="{$blocks['company-description-img']['alt'] ?? '公司概况'}">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- 发展历程 -->
|
||
|
|
<div class="about-course-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="course">
|
||
|
|
<div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<h2>{$blocks['history-title']['value'] ?? '发展历程'}</h2>
|
||
|
|
<span>{$blocks['history-subtitle']['value'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
<div class="memorabili-txt w1360">
|
||
|
|
<div class="memorabili-swiper swiper">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
{foreach $historyList as $history}
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<strong>{$history.title ?? ''}</strong>
|
||
|
|
<p>
|
||
|
|
{:nl2br($history.event) ?? ''}
|
||
|
|
</p>
|
||
|
|
<em><ins></ins></em>
|
||
|
|
</div>
|
||
|
|
{/foreach}
|
||
|
|
</div>
|
||
|
|
<div class="swiper-button-prev"></div>
|
||
|
|
<div class="swiper-button-next"></div>
|
||
|
|
</div>
|
||
|
|
<div class="line"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 制造实力 -->
|
||
|
|
<div class="strength-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="strength">
|
||
|
|
<div class="strength-img w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<img src="{$blocks['manufacture-top-video']['img'] ?? '__STATIC__/images/strength.jpg'}" alt="{$blocks['manufacture-title']['value'] ?? '制造实力'}">
|
||
|
|
<span><img src="__STATIC__/images/icon/icon-play.png" alt="播放"></span>
|
||
|
|
</div>
|
||
|
|
<div class="strength-content w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<h2>{$blocks['manufacture-title']['value'] ?? '制造实力'}</h2>
|
||
|
|
<span>{$blocks['manufacture-subtitle']['value'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
<div class="strength-txt">
|
||
|
|
<p>{:$blocks['manufacture-content']['value'] ?? ''}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 视频弹窗 -->
|
||
|
|
<div class="video-list-bg">
|
||
|
|
<div class="close-video"><img src="__STATIC__/images/icon/icon-close.png" alt="关闭"></div>
|
||
|
|
<ul class="video-list">
|
||
|
|
<li>
|
||
|
|
<video width="800" height="450" controls="controls">
|
||
|
|
<source src="{$blocks['manufacture-top-video']['value'] ?? ''}" type="video/mp4"></source>
|
||
|
|
</video>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<!-- 愿景使命 -->
|
||
|
|
<div class="vision-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="vision">
|
||
|
|
<div class="vision w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<h2>{$blocks['vision-title']['value'] ?? '愿景使命'}</h2>
|
||
|
|
<p>{$blocks['vision-description']['value'] ?? ''}</p>
|
||
|
|
</div>
|
||
|
|
<ul class="vision-list">
|
||
|
|
{if isset($blocks['vision-images']['value']) && !empty($blocks['vision-images']['value'])}
|
||
|
|
{php}$visionImages = json_decode($blocks['vision-images']['value'], true);{/php}
|
||
|
|
{foreach $visionImages as $k => $visionImage}
|
||
|
|
<li>
|
||
|
|
<div class="vision-txt">
|
||
|
|
<img src="{$visionImage['src'] ?? ''}" alt="{$visionImage['alt'] ?? ''}">
|
||
|
|
<p>
|
||
|
|
<strong>{$visionImage['title'] ?? ''}</strong>
|
||
|
|
<span>{$visionImage['desc'] ?? ''}</span>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
{/foreach}
|
||
|
|
{/if}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 荣誉资质 -->
|
||
|
|
<div class="honor-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="honor">
|
||
|
|
<div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<h2>{$blocks['honour-title']['value'] ?? '荣誉资质'}</h2>
|
||
|
|
<span>{$blocks['honour-subtitle']['value'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
<div class="honor-list w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<div class="honor-swiper swiper">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
<div class="swiper-slide">
|
||
|
|
{foreach $honourList as $k => $honour}
|
||
|
|
<div class="honor-item">
|
||
|
|
<span><img src="{$honour.image ?? ''}" alt="{$honour.title ?? ''}"></span>
|
||
|
|
<div class="honor-txt">
|
||
|
|
<p class="clips1">{$honour.title ?? ''} -{$k}</p>
|
||
|
|
<p class="clips1">{$honour.subtitle ?? ''}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{if ($k+1) % 10 == 0}
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
{/if}
|
||
|
|
{/foreach}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-button-prev"></div>
|
||
|
|
<div class="swiper-button-next"></div>
|
||
|
|
</div>
|
||
|
|
<!-- 资质弹出轮播 -->
|
||
|
|
<div class="all-bg"></div>
|
||
|
|
<div class="honor-list-other hide" id="honor-list-other">
|
||
|
|
<div class="honor-other-swiper swiper">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
{foreach $honourList as $honour}
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<img src="{$honour.image ?? ''}" alt="{$honour.title ?? ''}">
|
||
|
|
<p>{$honour.description ?? ''}</p>
|
||
|
|
</div>
|
||
|
|
{/foreach}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-button-prev"></div>
|
||
|
|
<div class="swiper-button-next"></div>
|
||
|
|
<div class="close-swiper"><img src="__STATIC__/images/icon/icon-close-swiper.png" alt="关闭"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 社会责任 -->
|
||
|
|
<div class="social-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="social">
|
||
|
|
<div class="social w1360">
|
||
|
|
<div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
<h2>{$blocks['responsibility-title']['value'] ?? '社会责任'}</h2>
|
||
|
|
<span>{$blocks['responsibility-subtitle']['value'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
<ul class="social-list w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
|
||
|
|
{if isset($blocks['responsibility-images']['value']) && !empty($blocks['responsibility-images']['value'])}
|
||
|
|
{php}$responsibilityImages = json_decode($blocks['responsibility-images']['value'], true);{/php}
|
||
|
|
{foreach $responsibilityImages as $k => $responsibilityImage}
|
||
|
|
<li>
|
||
|
|
<div class="social-img"><img src="{$responsibilityImage['src'] ?? ''}" alt="{$responsibilityImage['alt'] ?? ''}"></div>
|
||
|
|
<div class="social-txt">
|
||
|
|
<p>{$responsibilityImage['title'] ?? ''}</p>
|
||
|
|
<span class="clips5">{$responsibilityImage['desc'] ?? ''}</span>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
{/foreach}
|
||
|
|
{/if}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script type="text/javascript">
|
||
|
|
// <![CDATA[
|
||
|
|
var ais=1;
|
||
|
|
$(window).scroll(function() {
|
||
|
|
var data=$(".about-survey-bg").offset().top;
|
||
|
|
var oTop=document.body.scrollTop==0?document.documentElement.scrollTop:document.body.scrollTop; //IE和chrome获取方式不一样
|
||
|
|
if(oTop+$(window).height()-50>data&& ais==1){
|
||
|
|
ais=2;
|
||
|
|
$('.data-number').each(function(){
|
||
|
|
$(this).prop('Counters',0).animate({
|
||
|
|
Crs: $(this).text()
|
||
|
|
},{
|
||
|
|
duration: 1200,
|
||
|
|
easing: 'swing',
|
||
|
|
step: function (now){
|
||
|
|
$(this).text(Math.ceil(now));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
// ]]>
|
||
|
|
let surveyTop = $(".about-survey-bg").offset().top-80;
|
||
|
|
let courseTop = $(".about-course-bg").offset().top-80;
|
||
|
|
let strengthTop = $(".strength-bg").offset().top-80;
|
||
|
|
let visionTop = $(".vision-bg").offset().top-80;
|
||
|
|
let honorTop = $(".honor-bg").offset().top-80;
|
||
|
|
let socialTop = $(".social-bg").offset().top-80;
|
||
|
|
$(window).bind("scroll",function(){
|
||
|
|
let topScroll=$(this).scrollTop();//当前窗口的滚动距离
|
||
|
|
if(topScroll > surveyTop){
|
||
|
|
$(".pull-nav .swiper-slide>a").removeClass("active");
|
||
|
|
$(".survey-btn").addClass("active");
|
||
|
|
}
|
||
|
|
if(topScroll > surveyTop && topScroll > courseTop){
|
||
|
|
$(".pull-nav .swiper-slide>a").removeClass("active");
|
||
|
|
$(".course-btn").addClass("active");
|
||
|
|
}
|
||
|
|
if(topScroll > surveyTop && topScroll > courseTop && topScroll > strengthTop){
|
||
|
|
$(".about-nav>a").removeClass("active");
|
||
|
|
$(".strength-btn").addClass("active");
|
||
|
|
}
|
||
|
|
if(topScroll > surveyTop && topScroll > courseTop && topScroll > strengthTop && topScroll > visionTop){
|
||
|
|
$(".pull-nav .swiper-slide>a").removeClass("active");
|
||
|
|
$(".vision-btn").addClass("active");
|
||
|
|
}
|
||
|
|
if(topScroll > surveyTop && topScroll > courseTop && topScroll > strengthTop && topScroll > visionTop && topScroll > honorTop){
|
||
|
|
$(".pull-nav .swiper-slide>a").removeClass("active");
|
||
|
|
$(".honor-btn").addClass("active");
|
||
|
|
}
|
||
|
|
if(topScroll > surveyTop && topScroll > courseTop && topScroll > strengthTop && topScroll > visionTop && topScroll > honorTop && topScroll > socialTop){
|
||
|
|
$(".pull-nav .swiper-slide>a").removeClass("active");
|
||
|
|
$(".social-btn").addClass("active");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|