|
@ -31,7 +31,7 @@ paths.newsletter=images/newsletter/
|
|||
logging.file = /var/www/test.westgis.ac.cn/data/logs/debug.log
|
||||
page.limit=10
|
||||
import.dir=../data/import
|
||||
title.site=时空三极环境大数据平台
|
||||
title.site=三江源国家公园星空地一体化生态监测及数据平台
|
||||
title.data=数据产品
|
||||
title.heihe=黑河计划数据管理中心
|
||||
title.yrnmr=黄河上游宁蒙河段综合数据
|
||||
|
|
|
@ -50,7 +50,7 @@ class DataController extends Zend_Controller_Action
|
|||
$k5=$state->fetchAll();
|
||||
$this->view->keywords=array('place'=>$k1,'theme'=>$k2,'discipline'=>$k3,'stratum'=>$k4,'temporal'=>$k5);
|
||||
//最新10个入库数据
|
||||
$state=$this->db->query('select id,uuid,title,ts_published,description from normalmetadata order by id desc limit 8');
|
||||
$state=$this->db->query('select id,uuid,title,ts_published,description from normalmetadata order by id desc limit 4');
|
||||
$this->view->metadata = $state->fetchAll();
|
||||
//特色数据
|
||||
|
||||
|
|
|
@ -38,7 +38,7 @@ class IndexController extends Zend_Controller_Action
|
|||
$sql="select uuid,title,id from normalmetadata where id in (select m.id from normalmetadata m left join dataorder d on m.uuid=d.uuid group by m.id order by count(d.uuid) desc limit 8)";
|
||||
$this->db->setFetchMode(Zend_Db::FETCH_OBJ);
|
||||
$this->view->mdtop=$this->db->fetchAll($sql);
|
||||
$sql="select uuid,title,id from normalmetadata where id in (select m.id from normalmetadata m left join dataorder d on m.uuid=d.uuid group by m.id order by id desc limit 8)";
|
||||
$sql="select uuid,title,id,description from normalmetadata where id in (select m.id from normalmetadata m left join dataorder d on m.uuid=d.uuid group by m.id order by id desc limit 4)";
|
||||
$this->view->offlinemdtop=$this->db->fetchAll($sql);
|
||||
$sql="select m.uuid,m.title,m.id,m.description from normalmetadata m left join thumbnail t on m.id=t.id where length(t.data)>2 order by random()";
|
||||
$this->view->mdrandom=$this->db->fetchRow($sql);
|
||||
|
@ -78,7 +78,7 @@ class IndexController extends Zend_Controller_Action
|
|||
|
||||
$this->view->list_news = $rows;
|
||||
|
||||
$sql="select d.*,m.ts_published as publish_year from datadoi d left join metadata m on d.uuid=m.uuid where length(d.title)>1 and d.ts_published is not null order by ts_published desc limit 4";
|
||||
$sql="select d.*,m.ts_published as publish_year from datadoi d left join metadata m on d.uuid=m.uuid where length(d.title)>1 and d.ts_published is not null order by ts_published desc limit 5";
|
||||
$sth = $this->db->query($sql);
|
||||
$this->view->dois = $sth->fetchAll();
|
||||
|
||||
|
|
|
@ -0,0 +1,102 @@
|
|||
<?php
|
||||
$this->headTitle($this->config->title->site);
|
||||
$this->headTitle('新闻中心');
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$this->breadcrumb('<a href="/">首页</a>');
|
||||
$this->breadcrumb('新闻中心');
|
||||
$this->breadcrumb()->setSeparator(' > ');
|
||||
$this->headLink()->appendStylesheet('/static-sanji/css/new-list.css');
|
||||
?>
|
||||
<div class="body-warp">
|
||||
<div class="nav" id="nav">
|
||||
<ul>
|
||||
<?php
|
||||
if(count($this->types))
|
||||
{
|
||||
foreach($this->types as $k=>$v)
|
||||
{
|
||||
$haed = "";
|
||||
if(!empty($v[$this->deepField])) {$haed = str_repeat(' ',$v[$this->deepField]);}
|
||||
echo '<li><a href="'.$v['url'].'">'.$haed.$v['title'].'</a></li>';
|
||||
$haed = "";
|
||||
}
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="list-warp container">
|
||||
<ul>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表测数据集数据数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地量与气象要素观测</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测集数数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="page">
|
||||
<span>共125条记录</span>
|
||||
<span>共6页</span>
|
||||
<span><a href="javascript:" class="prev">上一页</a></span>
|
||||
<span class="pageSize"><a href="javascript:" class="pageClass">[1]</a></span>
|
||||
<span class="pageSize"><a href="javascript:">2</a></span>
|
||||
<span class="pageSize"><a href="javascript:">3</a></span>
|
||||
<span class="pageSize"><a href="javascript:">4</a></span>
|
||||
<span><a href="javascript:" class="next">下一页</a></span>
|
||||
<span><a href="#">返回顶部</a></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="span3">
|
||||
<div class="sidebar-nav bs-review-nav">
|
||||
<ul class="nav nav-list bs-review-sidenav">
|
||||
<li class="active"><a href="/archives"><i class="icon-chevron-right"></i>新闻中心</a></li>
|
||||
<?php
|
||||
if(count($this->types))
|
||||
{
|
||||
foreach($this->types as $k=>$v)
|
||||
{
|
||||
$haed = "";
|
||||
if(!empty($v[$this->deepField])) {$haed = str_repeat(' ',$v[$this->deepField]);}
|
||||
echo '<li><a href="'.$v['url'].'"><i class="icon-chevron-right"></i>'.$haed.$v['title'].'</a></li>';
|
||||
$haed = "";
|
||||
}
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<div class="row" id="container">
|
||||
<?php
|
||||
foreach($this->lists as $v)
|
||||
{?>
|
||||
<?php if(count($v['list'])>0) {?>
|
||||
<div class="span4 items">
|
||||
<h3><a href="<?= $v['url'] ?>"><?= $v['title'] ?></a></h3>
|
||||
<div class="list-content">
|
||||
<ul class="unstyled">
|
||||
<?php foreach($v['list'] as $arc){?>
|
||||
<li><small>[<?php echo date("Y-m-d",strtotime( $arc['ts_published'] )); ?>]</small>
|
||||
<a href="<?= $arc['url']?>"><?= $arc['title'] ?></a></li>
|
||||
<?php }?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<?php } }
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,102 +1,200 @@
|
|||
<?php
|
||||
$this->headTitle($this->config->title->site);
|
||||
$this->headTitle('新闻中心');
|
||||
$this->headTitle('新闻动态');
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$this->breadcrumb('<a href="/">首页</a>');
|
||||
$this->breadcrumb('新闻中心');
|
||||
$this->breadcrumb()->setSeparator(' > ');
|
||||
$this->headLink()->appendStylesheet('/static-sanji/css/new-list.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanjy-np/css/index.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanjy-np/css/about.css')
|
||||
?>
|
||||
<div class="body-warp">
|
||||
<div class="nav" id="nav">
|
||||
<ul>
|
||||
<?php
|
||||
if(count($this->types))
|
||||
{
|
||||
foreach($this->types as $k=>$v)
|
||||
{
|
||||
$haed = "";
|
||||
if(!empty($v[$this->deepField])) {$haed = str_repeat(' ',$v[$this->deepField]);}
|
||||
echo '<li><a href="'.$v['url'].'">'.$haed.$v['title'].'</a></li>';
|
||||
$haed = "";
|
||||
}
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="list-warp container">
|
||||
<ul>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表测数据集数据数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地量与气象要素观测</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测集数数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
<li><a href="#">海河流域多尺度地表通量与气象要素观测数据集数据正式发布</a><span>2018-02-03</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="page">
|
||||
<span>共125条记录</span>
|
||||
<span>共6页</span>
|
||||
<span><a href="javascript:" class="prev">上一页</a></span>
|
||||
<span class="pageSize"><a href="javascript:" class="pageClass">[1]</a></span>
|
||||
<span class="pageSize"><a href="javascript:">2</a></span>
|
||||
<span class="pageSize"><a href="javascript:">3</a></span>
|
||||
<span class="pageSize"><a href="javascript:">4</a></span>
|
||||
<span><a href="javascript:" class="next">下一页</a></span>
|
||||
<span><a href="#">返回顶部</a></span>
|
||||
<!--当前位置-->
|
||||
<div class="breadcrumb-wrapper">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4 bcid-cat">新闻动态</div>
|
||||
<div class="col-md-9 col-sm-8 location">
|
||||
<img src="/static-sanjy-np/img/address.png" alt="" />
|
||||
<span>当前位置:
|
||||
<a href="../index.html">主页</a> >
|
||||
<a href="news.html">新闻动态</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="span3">
|
||||
<div class="sidebar-nav bs-review-nav">
|
||||
<ul class="nav nav-list bs-review-sidenav">
|
||||
<li class="active"><a href="/archives"><i class="icon-chevron-right"></i>新闻中心</a></li>
|
||||
<?php
|
||||
if(count($this->types))
|
||||
{
|
||||
foreach($this->types as $k=>$v)
|
||||
{
|
||||
$haed = "";
|
||||
if(!empty($v[$this->deepField])) {$haed = str_repeat(' ',$v[$this->deepField]);}
|
||||
echo '<li><a href="'.$v['url'].'"><i class="icon-chevron-right"></i>'.$haed.$v['title'].'</a></li>';
|
||||
$haed = "";
|
||||
}
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
<div class="content content1">
|
||||
<div class="container">
|
||||
<div class="col-md-3" style="padding-left: 0;">
|
||||
<div class="in_left float_l">
|
||||
<h2 class="font24 t_big"><b>新闻动态</b></h2>
|
||||
<p class="font24 t_big1">NEWS</p>
|
||||
<img src="/static-sanjy-np/img/tie_suo.jpg" width="179" height="14">
|
||||
<ul class="in_list font14">
|
||||
<li><a href="news.html" class="active">平台新闻</a></li>
|
||||
<li><a href="news.html">今日三江源</a></li>
|
||||
<li><a href="news.html">物种监测</a></li>
|
||||
<li><a href="news.html">环境监测</a></li>
|
||||
</ul>
|
||||
<p><img src="/static-sanjy-np/img/map_img.jpg" width="183" height="174"></p>
|
||||
<div class="in_phone"><p class="y_1 color_3">02164057520</p><span class="y_2">欢迎您来电咨询</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<div class="row" id="container">
|
||||
<?php
|
||||
foreach($this->lists as $v)
|
||||
{?>
|
||||
<?php if(count($v['list'])>0) {?>
|
||||
<div class="span4 items">
|
||||
<h3><a href="<?= $v['url'] ?>"><?= $v['title'] ?></a></h3>
|
||||
<div class="list-content">
|
||||
<ul class="unstyled">
|
||||
<?php foreach($v['list'] as $arc){?>
|
||||
<li><small>[<?php echo date("Y-m-d",strtotime( $arc['ts_published'] )); ?>]</small>
|
||||
<a href="<?= $arc['url']?>"><?= $arc['title'] ?></a></li>
|
||||
<?php }?>
|
||||
</ul>
|
||||
<div class="main inner-left col-md-9" style="padding-right:0 ;">
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img class="img-responsive" src="/static-sanjy-np/img/2.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">昨天早晚高峰 10辆电动汽车公益接送市民</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>今日三江源
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php } }
|
||||
?>
|
||||
</div>
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img src="../img/1.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">大众不惧苹果谷歌 全新电动车充电仅需15分钟</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>平台新闻
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img class="img-responsive" src="../img/3.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">杨裕生院士:电动汽车这么补贴下去是大跃进</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>环境监测
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img class="img-responsive" src="../img/2.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">昨天早晚高峰 10辆电动汽车公益接送市民</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>今日三江源
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img class="img-responsive" src="../img/banner02.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">昨天早晚高峰 10辆电动汽车公益接送市民</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>物种监测
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blog-article hentry format-image">
|
||||
<figure>
|
||||
<img class="img-responsive" src="../img/2.jpg">
|
||||
</figure>
|
||||
<div class="entry-summary post-summary">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-title post-title">昨天早晚高峰 10辆电动汽车公益接送市民</h2>
|
||||
</header>
|
||||
<div class="entry-meta post-meta">
|
||||
<ul>
|
||||
<li class="entry-date date">
|
||||
<time class="entry-date"><i class="time"></i>2018-05-12</time>
|
||||
</li>
|
||||
<li class="tags">
|
||||
<i class="icon1"></i>今日三江源
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="entry-content">
|
||||
<p>大众汽车营销和销售负责人尤尔根斯塔克曼(Jrgen Stackmann)日前向媒体表示:(汽车市场)新进入者将看到当前条件下的机遇,不过我们并不担忧面临他们的挑战。显而易见,如今我们...</p>
|
||||
</div>
|
||||
<a href="newsDetail.html" class="read-more-link">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pagination-wrap">
|
||||
<div class="page">
|
||||
<div class="pagenavi">
|
||||
<ul class="pagination">
|
||||
<li class="disabled"><a href="javascript:;">«</a></li>
|
||||
<li class="active"><a href="javascript:void(0);">1</a></li>
|
||||
<li><a href="javascript:void(0);">2</a></li>
|
||||
<li class="disabled"><a href="javascript:;">»</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,153 @@
|
|||
<?php
|
||||
$this->headTitle($this->config->title->site);
|
||||
$this->headTitle($this->config->title->data);
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/dataProduct.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/header-position.css');
|
||||
?>
|
||||
<!--搜索框-->
|
||||
<div class="searchBox">
|
||||
<div class="container">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-group">
|
||||
<form action="/search" id="search-form">
|
||||
<input type="text" name="q" id="q" class="form-control" placeholder="搜素关键词">
|
||||
</form>
|
||||
</div>
|
||||
<i onclick="$('#search-form').submit()"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--固定搜索框-->
|
||||
<div class="searchBox searchBox1">
|
||||
<div class="container">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" placeholder="搜素关键词">
|
||||
</div>
|
||||
<i></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--搜索条件-->
|
||||
<div class="searchOne">
|
||||
<div class="container">
|
||||
<div class="col-lg-12">
|
||||
<?= $this->partial('data/tools.phtml'); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--最近更新数据-->
|
||||
<div class="intro1">
|
||||
<div class="container">
|
||||
<h2 class="title">最近更新数据</h2>
|
||||
<a href="/data/browse">查看更多</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="row">
|
||||
<?php foreach($this->metadata as $md) : ?>
|
||||
<div class="col-sm-6 col-md-6">
|
||||
<a href="/data/<?php echo $md['uuid'];?>">
|
||||
<div class="dataBox">
|
||||
<img src="/service/thumb/id/<?php echo $md['id']; ?>" alt="" />
|
||||
<div class="rightBox">
|
||||
<h6><?php echo $this->escape($md['title']);?></h6>
|
||||
<p><?= $this->escape($md['description']) ?></p>
|
||||
<span>发布时间:<?php echo date("Y-m-d",strtotime($md['ts_published'])); ?></span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--数据资源查找-->
|
||||
<div class="intro1">
|
||||
<div class="container">
|
||||
<h2 class="title">数据资源查找</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<ul id="myTab" class="nav nav-tabs">
|
||||
<li class="active">
|
||||
<a href="#tab1" data-toggle="tab">主题关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab2" data-toggle="tab">学科关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab3" data-toggle="tab">地点关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab4" data-toggle="tab">时间关键词</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div id="myTabContent" class="tab-content">
|
||||
<div class="tab-pane fade in active" id="tab1">
|
||||
<?php $type='theme'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab2">
|
||||
<?php $type='discipline'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab3">
|
||||
<?php $type='place'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab4">
|
||||
<?php $type='temporal'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<?php if($cg['keyword'] != '') {?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php } ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--数据服务-->
|
||||
<div class="intro1">
|
||||
<div class="container">
|
||||
<h2 class="title">数据服务</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a1">离线数据服务记录(最近20个)</a>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a2">如何从时空三极环境大数据平台申请数据</a>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a3">如何在时空三极环境大数据平台发布数据</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
/*顶部固定搜素*/
|
||||
$(window).scroll(function(){
|
||||
if($(window).scrollTop() >= 100){
|
||||
$(".searchBox1").show();
|
||||
} else{
|
||||
$(".searchBox1").hide();
|
||||
}
|
||||
});
|
||||
</script>
|
|
@ -2,152 +2,79 @@
|
|||
$this->headTitle($this->config->title->site);
|
||||
$this->headTitle($this->config->title->data);
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/dataProduct.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/header-position.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanjy-np/css/index.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanjy-np/css/about.css');
|
||||
|
||||
?>
|
||||
<!--搜索框-->
|
||||
<div class="searchBox">
|
||||
<!--当前位置-->
|
||||
<div class="breadcrumb-wrapper">
|
||||
<div class="container">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-group">
|
||||
<form action="/search" id="search-form">
|
||||
<input type="text" name="q" id="q" class="form-control" placeholder="搜素关键词">
|
||||
</form>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4 bcid-cat">数据服务</div>
|
||||
<div class="col-md-9 col-sm-8 location">
|
||||
<img src="static-sanjy-np/img/address.png" alt=""/>
|
||||
<span>当前位置:
|
||||
<a href="/">主页</a> >
|
||||
<a href="/data">数据服务</a>
|
||||
</span>
|
||||
</div>
|
||||
<i onclick="$('#search-form').submit()"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--固定搜索框-->
|
||||
<div class="searchBox searchBox1">
|
||||
<div class="container">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" placeholder="搜素关键词">
|
||||
</div>
|
||||
<i></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--搜索条件-->
|
||||
<div class="searchOne">
|
||||
<div class="container">
|
||||
<div class="col-lg-12">
|
||||
<?= $this->partial('data/tools.phtml'); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--最近更新数据-->
|
||||
<div class="intro1">
|
||||
<div class="content content1">
|
||||
<div class="container">
|
||||
<h2 class="title">最近更新数据</h2>
|
||||
<a href="/data/browse">查看更多</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="row">
|
||||
<?php foreach($this->metadata as $md) : ?>
|
||||
<div class="col-sm-6 col-md-6">
|
||||
<a href="/data/<?php echo $md['uuid'];?>">
|
||||
<div class="dataBox">
|
||||
<img src="/service/thumb/id/<?php echo $md['id']; ?>" alt="" />
|
||||
<div class="rightBox">
|
||||
<h6><?php echo $this->escape($md['title']);?></h6>
|
||||
<p><?= $this->escape($md['description']) ?></p>
|
||||
<span>发布时间:<?php echo date("Y-m-d",strtotime($md['ts_published'])); ?></span>
|
||||
</div>
|
||||
<div class="searchBox">
|
||||
<i>搜索</i><input type="text" placeholder="请输入搜索内容">
|
||||
</div>
|
||||
|
||||
<div class="guanjian"><a href="">关键词1</a><a href="">关键词1</a><a href="">关键词1</a><a href="">关键词1</a><a href="">关键词1</a>
|
||||
</div>
|
||||
<div class="col-md-3" style="padding-left: 0;">
|
||||
<div class="in_left float_l">
|
||||
<h2 class="font24 t_big"><b>数据服务</b></h2>
|
||||
<p class="font24 t_big1">DATA</p>
|
||||
<img src="/static-sanjy-np/img/tie_suo.jpg" width="179" height="14">
|
||||
<ul class="in_list font14">
|
||||
<li><a href="data.html" class="active">全部数据</a></li>
|
||||
<li><a href="data.html">最新数据</a></li>
|
||||
</ul>
|
||||
<p><img src="/static-sanjy-np/img/map_img.jpg" width="183" height="174"></p>
|
||||
<div class="in_phone"><p class="y_1 color_3">02164057520</p><span class="y_2">欢迎您来电咨询</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main inner-left col-md-9" style="padding-right:0 ;">
|
||||
<ul class="newUlList">
|
||||
<?php foreach ($this->metadata as $md) : ?>
|
||||
<li>
|
||||
<div class="newsImgBox">
|
||||
<img src="/service/thumb/id/<?php echo $md['id']; ?>">
|
||||
</div>
|
||||
<div class="newRight">
|
||||
<div class="newTopTitle">
|
||||
<span><?php echo $this->escape($md['title']);?></span>
|
||||
<i><?php echo date("Y-m-d",strtotime($md['ts_published'])); ?></i>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<p>
|
||||
<?= $this->escape($md['description']) ?>
|
||||
</p>
|
||||
<a class="more" href="/data/<?php echo $md['uuid'];?>">查看详情</a>
|
||||
</div>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="pagination-wrap">
|
||||
<div class="page">
|
||||
<div class="pagenavi">
|
||||
<ul class="pagination">
|
||||
<li class="disabled"><a href="javascript:;">«</a></li>
|
||||
<li class="active"><a href="javascript:void(0);">1</a></li>
|
||||
<li><a href="javascript:void(0);">2</a></li>
|
||||
<li class="disabled"><a href="javascript:;">»</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--数据资源查找-->
|
||||
<div class="intro1">
|
||||
<div class="container">
|
||||
<h2 class="title">数据资源查找</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<ul id="myTab" class="nav nav-tabs">
|
||||
<li class="active">
|
||||
<a href="#tab1" data-toggle="tab">主题关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab2" data-toggle="tab">学科关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab3" data-toggle="tab">地点关键词</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tab4" data-toggle="tab">时间关键词</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div id="myTabContent" class="tab-content">
|
||||
<div class="tab-pane fade in active" id="tab1">
|
||||
<?php $type='theme'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab2">
|
||||
<?php $type='discipline'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab3">
|
||||
<?php $type='place'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab4">
|
||||
<?php $type='temporal'; ?>
|
||||
<?php foreach($this->keywords[$type] as $cg) : ?>
|
||||
<?php if($cg['keyword'] != '') {?>
|
||||
<a class="btn a-btn btn-default col-sm-2" href="/data/tag/<?= $cg['keyword'] ?>"><?= $cg['keyword'] ?></a>
|
||||
<?php } ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--数据服务-->
|
||||
<div class="intro1">
|
||||
<div class="container">
|
||||
<h2 class="title">数据服务</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a1">离线数据服务记录(最近20个)</a>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a2">如何从时空三极环境大数据平台申请数据</a>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 addOne">
|
||||
<a href="" class="a3">如何在时空三极环境大数据平台发布数据</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
/*顶部固定搜素*/
|
||||
$(window).scroll(function(){
|
||||
if($(window).scrollTop() >= 100){
|
||||
$(".searchBox1").show();
|
||||
} else{
|
||||
$(".searchBox1").hide();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</div>
|
|
@ -0,0 +1,498 @@
|
|||
<?php
|
||||
$this->headTitle($this->config->title->site);
|
||||
$this->headTitle('首页');
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$auth = Zend_Auth::getInstance();
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/index.css');
|
||||
//$this->headLink()->appendStylesheet('/static-sanji-v2/css/number.css');
|
||||
?>
|
||||
<div id="myCarousel" class="carousel slide">
|
||||
<div class="carousel-inner">
|
||||
<?php foreach($this->news as $k=>$v) { ?>
|
||||
<?php
|
||||
$description = "";
|
||||
if (mb_strlen($v['description'])>100)
|
||||
{
|
||||
$description = mb_substr($v['description'],0,100,'utf-8').'...';
|
||||
}else{
|
||||
$description = $v['description'];
|
||||
}
|
||||
?>
|
||||
<div class="item item<?= $k + 1 ?> <?= $k == 0 ? 'active':''?>" style="background-image: url('<?php echo $v['image']; ?>');"></div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
|
||||
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"><img src="/static-sanji-v2/img/left.png" alt="" /></span>
|
||||
</a>
|
||||
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
|
||||
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"><img src="/static-sanji-v2/img/right.png" alt="" /></span>
|
||||
</a>
|
||||
</div>
|
||||
<!--专题数据-->
|
||||
<div class="features features-hotnews ">
|
||||
<h3 class="navigation">
|
||||
<span>专题数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="" class="more"></a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="block-box col-md-12">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img class="" alt="图片加载中" src="/static-sanji-v2/img/data1.png" /></div>
|
||||
<div class="infobox">
|
||||
<p>南极200米分辨率冰盖表面高程模型是我国自主生产的南极遥感地形数据,该图利用2003-2009年间的ICESat/GLAS星载激光雷达数据和EnviSatRA-2雷达高度计数据,通过对ICESat/GLAS数据进行质量控制、饱和度纠正和对EnviSatRA-2高度计数据进行基于地形特征的相对纠正等关键技术处理,将两种不同的测高数据融合,增加了测高数据的采样密度。利用航空激光雷达和实测GPS数据验证,显示该数据的精度为3.21-27.84米,相比国际最新的DEM该数据在地形复杂区域精度有所提高。该数据将为我国南极科考提供基础数据,服务于我国南极科学研究。</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>南极200米分辨率冰盖表面高程模型是我国自主生产的南极遥感地形数据,该图利用2003-2009年间的ICESat/GLAS星载激光雷达数据和EnviSatRA-2雷达高度计数据,通过对ICESat/GLAS数据进行质量控制、饱和度纠正和对EnviSatRA-2高度计数据进行基于地形特征的相对纠正等关键技术处理,将两种不同的测高数据融合,增加了测高数据的采样密度。利用航空激光雷达和实测GPS数据验证,显示该数据的精度为3.21-27.84米,相比国际最新的DEM该数据在地形复杂区域精度有所提高。该数据将为我国南极科考提供基础数据,服务于我国南极科学研究。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img class="" src="/static-sanji-v2/img/data2.gif" /></div>
|
||||
<div class="infobox">
|
||||
<p>北极地区是对气候变化最为敏感的地区之一,长期以来受到了气候变化研究的极大关注。尽管最近一段时间,全球暖化出现了一定程度的减缓甚至停滞的迹象,但北极地区的气候变化在过去几十年间却出现了明显的加速:一方面北极夏秋季的海冰覆盖正在加速融化(如图1),北极海冰覆盖面积历史低值被不断刷新,2012年九月份的海冰覆盖面积仅相当于1979到2000年多年平均海冰面积的51%,相对于上世纪八十年代初,已经有超过一半的海冰在夏天消失了,2002-2011年间海冰面积减少速度是1979-2006年间减少速度的两倍还多...</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>北极地区是对气候变化最为敏感的地区之一,长期以来受到了气候变化研究的极大关注。尽管最近一段时间,全球暖化出现了一定程度的减缓甚至停滞的迹象,但北极地区的气候变化在过去几十年间却出现了明显的加速:一方面北极夏秋季的海冰覆盖正在加速融化(如图1),北极海冰覆盖面积历史低值被不断刷新,2012年九月份的海冰覆盖面积仅相当于1979到2000年多年平均海冰面积的51%,相对于上世纪八十年代初,已经有超过一半的海冰在夏天消失了,2002-2011年间海冰面积减少速度是1979-2006年间减少速度的两倍还多...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img src="/static-sanji-v2/img/data3.png" /></div>
|
||||
<div class="infobox">
|
||||
<p>被誉为地球上的"三极"的青藏高原,因其是驱动全球环境变化研究的重要区域,对整个地球的生态、环境、气候产生深刻的调控作用,一直是国际社会关注的热点。全球变暖背景下三极冰川、冻土、冻融湖等冰冻圈要素已经发生了显著变化,冰川快速退缩、冻土活动层增厚。长期以来,我国在以青藏高原为主体的世界第三极开展了系统的、多学科的研究,形成了丰富的研究积累。相对于青藏高原研究,我国目前在南北极地区科学研究的水平较低,尤其存在研究基础薄弱、研究方向分散且不系统、水平低等问题。随着气候变暖的影响...</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>被誉为地球上的"三极"的青藏高原,因其是驱动全球环境变化研究的重要区域,对整个地球的生态、环境、气候产生深刻的调控作用,一直是国际社会关注的热点。全球变暖背景下三极冰川、冻土、冻融湖等冰冻圈要素已经发生了显著变化,冰川快速退缩、冻土活动层增厚。长期以来,我国在以青藏高原为主体的世界第三极开展了系统的、多学科的研究,形成了丰富的研究积累。相对于青藏高原研究,我国目前在南北极地区科学研究的水平较低,尤其存在研究基础薄弱、研究方向分散且不系统、水平低等问题。随着气候变暖的影响...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--数据统计-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>数据统计</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="contactUs" >
|
||||
<div class="contactUsContent">
|
||||
<div id="mindex" data-options-ease="Expo.easeInOut" data-options-speed="1" data-options-sscreen="0"></div>
|
||||
<style type="text/css">
|
||||
.module.mcounter.mm98043 ul.content_list li {
|
||||
width: 25%
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li div {
|
||||
border-color: rgba(63, 86, 110, .08);
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li p {
|
||||
font-family: 'HelveticaNeuefcbed078a1b793'!important;
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li p.number .counterDX {
|
||||
color: rgba(63, 86, 110, 1);
|
||||
}
|
||||
.module.mcounter.mm98043 ul.content_list li p.number .unit {
|
||||
color: rgba(63, 86, 110, 1);
|
||||
}
|
||||
</style>
|
||||
<div class="mcounter module mm98043">
|
||||
<div class="bgmask"></div>
|
||||
<div class="content backBg">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="module-content fw">
|
||||
<div class="wrapper">
|
||||
<ul class="content_list">
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo $this->metanum; ?>" id="projectNum"><?php echo $this->metanum; ?></span></p>
|
||||
<p class="title">元数据个数</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo number_format($this->onlinesize/1000,2,'.',''); ?>" id="buildingNum"><?php echo number_format($this->onlinesize/1000,2,'.',''); ?></span></p>
|
||||
<p class="title">在线数据(GB)</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo number_format(($this->onlinesize+$this->offlinesize)/1000,2,'.',''); ?>" id="managementNum"><?php echo number_format(($this->onlinesize+$this->offlinesize)/1000,2,'.',''); ?></span></p>
|
||||
<p class="title">总数据(GB)</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo $this->usernum; ?>" id="allMoneyNum"><?php echo $this->usernum; ?></span></p>
|
||||
<p class="title">总注册用户(人)</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--典型数据-->
|
||||
<h3 class="navigation">
|
||||
<span>典型数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container newData">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<img src="/static-sanji-v2/img/data_product_1.gif" style="margin-top: 80px;margin-bottom: 80px;"/>
|
||||
<p>基于微波辐射计的南极冰盖融化面积和持续时间变化(1978-2014)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<img src="/static-sanji-v2/img/data_product_2.gif" alt="" style="margin: 30px 0;"/>
|
||||
<p>基于微波辐射计的格陵兰冰盖融化面积和持续时间变化(1979-2014)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<a href="/static-sanji-v2/html/video.html" style="display: block;" target="_blank">
|
||||
<video autoplay="" muted="" loop="" class="video">
|
||||
<source src="/static-sanji-v2/img/tpe_1.mp4" type="video/mp4">
|
||||
</video>
|
||||
<p style="height: 60px;">基于MODIS的2003年高亚洲积雪覆盖变化</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--热门数据-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>热门数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="/data" class="more">查看更多</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<?php foreach($this->mdtop as $i=>$md) : ?>
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<a href="/data/<?php echo $md->uuid; ?>">
|
||||
<div class="science p-box">
|
||||
<img src="/service/thumb/id/<?php echo $md->id; ?>" alt="">
|
||||
<div class="p-title">
|
||||
<p><?php echo $md->title; ?></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--新闻动态-->
|
||||
<h3 class="navigation">
|
||||
<span>新闻动态</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="newsBox" >
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="/archives/news/localnews" class="more">查看更多</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5">
|
||||
<div class="newsBoxL">
|
||||
<img src="<?= $this->list_news[0] && $this->list_news[0]['image'] && $this->list_news[0]['image'] != '' ? $this->list_news[0]['image']:'/static-sanji-v2/img/20180206161540_37955.png' ?>" alt="">
|
||||
<div class="newsBoxLTxt">
|
||||
<div class="newsBoxLTxtL">
|
||||
<i><?= date('d',strtotime($this->list_news[0]['ts_published'])) ?></i>
|
||||
<span><?= date('Y-m',strtotime($this->list_news[0]['ts_published'])) ?></span>
|
||||
</div>
|
||||
<div class="newsBoxLTxtR">
|
||||
<a href="<?= $this->list_news[0]['url'] ?>">
|
||||
<h6><?= $this->list_news[0]['title'] ?></h6>
|
||||
<p><?= $this->list_news[0]['description'] ?></p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-7">
|
||||
<div class="newsBoxR">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[1]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[1]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[1]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[1]['ts_published'])) ?></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[1]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li style="height: 5px;"></li>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[2]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[2]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[2]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[2]['ts_published'])) ?></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[2]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li style="height: 5px;"></li>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[3]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[3]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[3]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[3]['ts_published'])) ?></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[3]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--最新数据-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>最新数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="" class="more">查看更多</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<?php foreach($this->offlinemdtop as $i=>$md) : ?>
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<a href="/data/<?php echo $md->uuid; ?>" target="_blank">
|
||||
<div class="science p-box">
|
||||
<img src="/service/thumb/id/<?php echo $md->id; ?>" alt="">
|
||||
<div class="p-title">
|
||||
<p><?php echo $md->title; ?></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--合作单位-->
|
||||
<h3 class="navigation">
|
||||
<span>合作单位</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div id="myCarouse2" class="carousel carouse2 slide pad_010 b_k" data-ride="carousel">
|
||||
<ol class="carousel-indicators">
|
||||
<li data-target="#myCarouse2" data-slide-to="0" class="active"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="1"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="2"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="3"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="4"></li>
|
||||
</ol>
|
||||
<!-- 轮播(Carousel)项目 -->
|
||||
<div class="carousel-inner bor_btm">
|
||||
<div class="item active" >
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator32.jpg"><p>中国科学院青藏高原研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator34.png"><p>中国科学院西北生态环境资源研究院</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator35.jpg"><p>中国科学院遥感与数字地球研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator26.jpg"><p>中国科学院大气物理研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator25.png"><p>中国科学院测量与地球物理研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator28.jpg"><p>中国科学院地理科学与资源研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator29.jpg"><p>中国科学院地质与地球物理研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator30.jpg"><p>中国科学院东北地理与农业生态研究所</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator27.jpg"><p>中国科学院大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator33.jpg"><p>中国科学院上海天文台</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator2.jpg"><p>北京师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator23.jpg"><p>中国地质大学(武汉)</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator36.jpg"><p>中国科学院植物研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator31.jpg"><p>中国科学院南京地理与湖泊研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator19.jpg"><p>西北大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator20.png"><p>西南大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator18.png"><p>上海师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator3.jpg"><p>成都高原气象研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator37.jpg"><p>中国气象科学研究院</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator22.jpg"><p>香港中文大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator24.jpg"><p>中国极地研究中心</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator16.png"><p>清华大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator4.jpg"><p>成都信息工程大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator21.jpg"><p>香港大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator14.jpg"><p>南方科技大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator9.jpg"><p>兰州大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator7.jpg"><p>西南科技大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator10.jpg"><p>美国德克萨斯大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator1.jpg"><p>北京林业大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator8.png"><p>华东师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator12.jpg"><p>美国加州大学洛杉矶分校</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator11.jpg"><p>美国华盛顿大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator13.png"><p>美国犹他大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator15.png"><p>挪威南森环境遥感中心</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator17.png"><p>瑞士苏黎世大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator1.jpg"><p>华东师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator5.jpg"><p>俄罗斯莫斯科州立大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator6.png"><p>芬兰气象研究所</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -3,491 +3,190 @@ $this->headTitle($this->config->title->site);
|
|||
$this->headTitle('首页');
|
||||
$this->headTitle()->setSeparator(' - ');
|
||||
$auth = Zend_Auth::getInstance();
|
||||
$this->headLink()->appendStylesheet('/static-sanji-v2/css/index.css');
|
||||
$this->headLink()->appendStylesheet('/static-sanjy-np/css/index.css');
|
||||
//$this->headLink()->appendStylesheet('/static-sanji-v2/css/number.css');
|
||||
?>
|
||||
<div id="myCarousel" class="carousel slide">
|
||||
<div class="carousel-inner">
|
||||
<?php foreach($this->news as $k=>$v) { ?>
|
||||
<?php
|
||||
$description = "";
|
||||
if (mb_strlen($v['description'])>100)
|
||||
{
|
||||
$description = mb_substr($v['description'],0,100,'utf-8').'...';
|
||||
}else{
|
||||
$description = $v['description'];
|
||||
}
|
||||
?>
|
||||
<div class="item item<?= $k + 1 ?> <?= $k == 0 ? 'active':''?>" style="background-image: url('<?php echo $v['image']; ?>');"></div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
|
||||
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"><img src="/static-sanji-v2/img/left.png" alt="" /></span>
|
||||
</a>
|
||||
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
|
||||
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"><img src="/static-sanji-v2/img/right.png" alt="" /></span>
|
||||
</a>
|
||||
</div>
|
||||
<!--专题数据-->
|
||||
<div class="features features-hotnews ">
|
||||
<h3 class="navigation">
|
||||
<span>专题数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="" class="more"></a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="block-box col-md-12">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img class="" alt="图片加载中" src="/static-sanji-v2/img/data1.png" /></div>
|
||||
<div class="infobox">
|
||||
<p>南极200米分辨率冰盖表面高程模型是我国自主生产的南极遥感地形数据,该图利用2003-2009年间的ICESat/GLAS星载激光雷达数据和EnviSatRA-2雷达高度计数据,通过对ICESat/GLAS数据进行质量控制、饱和度纠正和对EnviSatRA-2高度计数据进行基于地形特征的相对纠正等关键技术处理,将两种不同的测高数据融合,增加了测高数据的采样密度。利用航空激光雷达和实测GPS数据验证,显示该数据的精度为3.21-27.84米,相比国际最新的DEM该数据在地形复杂区域精度有所提高。该数据将为我国南极科考提供基础数据,服务于我国南极科学研究。</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>南极200米分辨率冰盖表面高程模型是我国自主生产的南极遥感地形数据,该图利用2003-2009年间的ICESat/GLAS星载激光雷达数据和EnviSatRA-2雷达高度计数据,通过对ICESat/GLAS数据进行质量控制、饱和度纠正和对EnviSatRA-2高度计数据进行基于地形特征的相对纠正等关键技术处理,将两种不同的测高数据融合,增加了测高数据的采样密度。利用航空激光雷达和实测GPS数据验证,显示该数据的精度为3.21-27.84米,相比国际最新的DEM该数据在地形复杂区域精度有所提高。该数据将为我国南极科考提供基础数据,服务于我国南极科学研究。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img class="" src="/static-sanji-v2/img/data2.gif" /></div>
|
||||
<div class="infobox">
|
||||
<p>北极地区是对气候变化最为敏感的地区之一,长期以来受到了气候变化研究的极大关注。尽管最近一段时间,全球暖化出现了一定程度的减缓甚至停滞的迹象,但北极地区的气候变化在过去几十年间却出现了明显的加速:一方面北极夏秋季的海冰覆盖正在加速融化(如图1),北极海冰覆盖面积历史低值被不断刷新,2012年九月份的海冰覆盖面积仅相当于1979到2000年多年平均海冰面积的51%,相对于上世纪八十年代初,已经有超过一半的海冰在夏天消失了,2002-2011年间海冰面积减少速度是1979-2006年间减少速度的两倍还多...</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>北极地区是对气候变化最为敏感的地区之一,长期以来受到了气候变化研究的极大关注。尽管最近一段时间,全球暖化出现了一定程度的减缓甚至停滞的迹象,但北极地区的气候变化在过去几十年间却出现了明显的加速:一方面北极夏秋季的海冰覆盖正在加速融化(如图1),北极海冰覆盖面积历史低值被不断刷新,2012年九月份的海冰覆盖面积仅相当于1979到2000年多年平均海冰面积的51%,相对于上世纪八十年代初,已经有超过一半的海冰在夏天消失了,2002-2011年间海冰面积减少速度是1979-2006年间减少速度的两倍还多...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4 hoverBox">
|
||||
<div class="zhuantiBox">
|
||||
<a target="_blank" href="">
|
||||
<div class="hot-im-wrapper"><img src="/static-sanji-v2/img/data3.png" /></div>
|
||||
<div class="infobox">
|
||||
<p>被誉为地球上的"三极"的青藏高原,因其是驱动全球环境变化研究的重要区域,对整个地球的生态、环境、气候产生深刻的调控作用,一直是国际社会关注的热点。全球变暖背景下三极冰川、冻土、冻融湖等冰冻圈要素已经发生了显著变化,冰川快速退缩、冻土活动层增厚。长期以来,我国在以青藏高原为主体的世界第三极开展了系统的、多学科的研究,形成了丰富的研究积累。相对于青藏高原研究,我国目前在南北极地区科学研究的水平较低,尤其存在研究基础薄弱、研究方向分散且不系统、水平低等问题。随着气候变暖的影响...</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="hotnews-box1">
|
||||
<p>被誉为地球上的"三极"的青藏高原,因其是驱动全球环境变化研究的重要区域,对整个地球的生态、环境、气候产生深刻的调控作用,一直是国际社会关注的热点。全球变暖背景下三极冰川、冻土、冻融湖等冰冻圈要素已经发生了显著变化,冰川快速退缩、冻土活动层增厚。长期以来,我国在以青藏高原为主体的世界第三极开展了系统的、多学科的研究,形成了丰富的研究积累。相对于青藏高原研究,我国目前在南北极地区科学研究的水平较低,尤其存在研究基础薄弱、研究方向分散且不系统、水平低等问题。随着气候变暖的影响...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ol class="carousel-indicators">
|
||||
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
|
||||
<li data-target="#carousel-example-generic" data-slide-to="1" class=""></li>
|
||||
<li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
|
||||
</ol>
|
||||
<div class="banner-inner carousel-inner" role="listbox">
|
||||
<div class="item active">
|
||||
<img src="/static-sanjy-np/img/banner01.jpg"/>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="/static-sanjy-np/img/banner02.jpg"/>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="/static-sanjy-np/img/banner03.jpg"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--数据统计-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>数据统计</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="contactUs" >
|
||||
<div class="contactUsContent">
|
||||
<div id="mindex" data-options-ease="Expo.easeInOut" data-options-speed="1" data-options-sscreen="0"></div>
|
||||
<style type="text/css">
|
||||
.module.mcounter.mm98043 ul.content_list li {
|
||||
width: 25%
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li div {
|
||||
border-color: rgba(63, 86, 110, .08);
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li p {
|
||||
font-family: 'HelveticaNeuefcbed078a1b793'!important;
|
||||
}
|
||||
|
||||
.module.mcounter.mm98043 ul.content_list li p.number .counterDX {
|
||||
color: rgba(63, 86, 110, 1);
|
||||
}
|
||||
.module.mcounter.mm98043 ul.content_list li p.number .unit {
|
||||
color: rgba(63, 86, 110, 1);
|
||||
}
|
||||
</style>
|
||||
<div class="mcounter module mm98043">
|
||||
<div class="bgmask"></div>
|
||||
<div class="content backBg">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="module-content fw">
|
||||
<div class="wrapper">
|
||||
<ul class="content_list">
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo $this->metanum; ?>" id="projectNum"><?php echo $this->metanum; ?></span></p>
|
||||
<p class="title">元数据个数</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo number_format($this->onlinesize/1000,2,'.',''); ?>" id="buildingNum"><?php echo number_format($this->onlinesize/1000,2,'.',''); ?></span></p>
|
||||
<p class="title">在线数据(GB)</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo number_format(($this->onlinesize+$this->offlinesize)/1000,2,'.',''); ?>" id="managementNum"><?php echo number_format(($this->onlinesize+$this->offlinesize)/1000,2,'.',''); ?></span></p>
|
||||
<p class="title">总数据(GB)</p>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div>
|
||||
<p class="number"><span class="counterDX" data-counter-value="<?php echo $this->usernum; ?>" id="allMoneyNum"><?php echo $this->usernum; ?></span></p>
|
||||
<p class="title">总注册用户(人)</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--最新数据-->
|
||||
<div class="newData">
|
||||
<div class="container" style="position: relative;">
|
||||
<h6 class="title title1">最新数据</h6>
|
||||
<a href="/data" class="more">查看更多>></a>
|
||||
<div class="row">
|
||||
<?php foreach ($this->offlinemdtop as $i => $md) : ?>
|
||||
<div class="col-md-3 col-sm-6 col-xs-6 iw4-item">
|
||||
<div class="team-wrap text-center">
|
||||
<div class="team-img">
|
||||
<a href="/data/<?php echo $md->uuid; ?>"><img class="img-responsive"
|
||||
src="/service/thumb/id/<?php echo $md->id; ?>"></a>
|
||||
<div class="team-social">
|
||||
<a href="/data/<?php echo $md->uuid; ?>"><i class="fa fa-eye"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--典型数据-->
|
||||
<h3 class="navigation">
|
||||
<span>典型数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container newData">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<img src="/static-sanji-v2/img/data_product_1.gif" style="margin-top: 80px;margin-bottom: 80px;"/>
|
||||
<p>基于微波辐射计的南极冰盖融化面积和持续时间变化(1978-2014)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<img src="/static-sanji-v2/img/data_product_2.gif" alt="" style="margin: 30px 0;"/>
|
||||
<p>基于微波辐射计的格陵兰冰盖融化面积和持续时间变化(1979-2014)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-4">
|
||||
<div class="hotnews-box imgBox">
|
||||
<a href="/static-sanji-v2/html/video.html" style="display: block;" target="_blank">
|
||||
<video autoplay="" muted="" loop="" class="video">
|
||||
<source src="/static-sanji-v2/img/tpe_1.mp4" type="video/mp4">
|
||||
</video>
|
||||
<p style="height: 60px;">基于MODIS的2003年高亚洲积雪覆盖变化</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--热门数据-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>热门数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="/data" class="more">查看更多</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<?php foreach($this->mdtop as $i=>$md) : ?>
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<a href="/data/<?php echo $md->uuid; ?>">
|
||||
<div class="science p-box">
|
||||
<img src="/service/thumb/id/<?php echo $md->id; ?>" alt="">
|
||||
<div class="p-title">
|
||||
<p><?php echo $md->title; ?></p>
|
||||
<div class="team-content">
|
||||
<span class="designation"><?php echo $md->title; ?></span>
|
||||
<p class="desc"><?php echo $md->description; ?></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--新闻动态-->
|
||||
<h3 class="navigation">
|
||||
<span>新闻动态</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="newsBox" >
|
||||
|
||||
<!--三江源地图-->
|
||||
<div class="myMap">
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="/archives/news/localnews" class="more">查看更多</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5">
|
||||
<div class="newsBoxL">
|
||||
<img src="<?= $this->list_news[0] && $this->list_news[0]['image'] && $this->list_news[0]['image'] != '' ? $this->list_news[0]['image']:'/static-sanji-v2/img/20180206161540_37955.png' ?>" alt="">
|
||||
<div class="newsBoxLTxt">
|
||||
<div class="newsBoxLTxtL">
|
||||
<i><?= date('d',strtotime($this->list_news[0]['ts_published'])) ?></i>
|
||||
<span><?= date('Y-m',strtotime($this->list_news[0]['ts_published'])) ?></span>
|
||||
<h6 class="title title1">三江源地图</h6>
|
||||
<div id="map" class="map" style="height: 450px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--新闻动态-->
|
||||
<div class="news">
|
||||
<div class="container">
|
||||
<h6 class="title title1">新闻动态</h6>
|
||||
<dl class="i_news clearfix">
|
||||
<dt class="col-md-4" style="padding-left: 0;">
|
||||
<div class="slide carousel2" data-ride="carousel">
|
||||
<div class="banner-inner carousel-inner">
|
||||
<div class="item active">
|
||||
<img src="<?= $this->list_news[0] && $this->list_news[0]['image'] && $this->list_news[0]['image'] != '' ? $this->list_news[0]['image'] : '/static-sanjy-np/img/banner01.jpg' ?>">
|
||||
</div>
|
||||
<div class="newsBoxLTxtR">
|
||||
<a href="<?= $this->list_news[0]['url'] ?>">
|
||||
<h6><?= $this->list_news[0]['title'] ?></h6>
|
||||
<p><?= $this->list_news[0]['description'] ?></p>
|
||||
</a>
|
||||
<div class="item">
|
||||
<img src="<?= $this->list_news[1] && $this->list_news[1]['image'] && $this->list_news[1]['image'] != '' ? $this->list_news[1]['image'] : '/static-sanjy-np/img/banner02.jpg' ?>"/>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="<?= $this->list_news[2] && $this->list_news[2]['image'] && $this->list_news[2]['image'] != '' ? $this->list_news[2]['image'] : '/static-sanjy-np/img/banner03.jpg' ?>"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-7">
|
||||
<div class="newsBoxR">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[1]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[1]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[1]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[1]['ts_published'])) ?></i>
|
||||
</div>
|
||||
</dt>
|
||||
<dd class="col-md-8" style="padding-right: 0;">
|
||||
<div class="news-wrap active">
|
||||
<ul class="news-list row">
|
||||
<li class="news-list-item col-sm-12">
|
||||
<div class="news-item-time"><span class="news-item-day"><?= date('d',strtotime($this->list_news[0]['ts_published'])) ?></span><br>
|
||||
<span class="news-item-month"><?= date('Y-m',strtotime($this->list_news[0]['ts_published'])) ?></span></div>
|
||||
<div class="news-item-text">
|
||||
<a class="news-item-title customize-unpreviewable"
|
||||
href="<?= $this->list_news[0]['url'] ?>"><?= $this->list_news[0]['title'] ?></a>
|
||||
<div class="news-item-content">
|
||||
<?= $this->list_news[0]['description'] ?>。
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[1]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li style="height: 5px;"></li>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[2]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[2]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[2]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[2]['ts_published'])) ?></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[2]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
<li class="news-list-item col-sm-12">
|
||||
<div class="news-item-time"><span class="news-item-day"><?= date('d',strtotime($this->list_news[1]['ts_published'])) ?></span><br>
|
||||
<span class="news-item-month"><?= date('Y-m',strtotime($this->list_news[1]['ts_published'])) ?></span></div>
|
||||
<div class="news-item-text">
|
||||
<a class="news-item-title customize-unpreviewable"
|
||||
href="<?= $this->list_news[1]['url'] ?>"><?= $this->list_news[1]['title'] ?></a>
|
||||
<div class="news-item-content"><?= $this->list_news[1]['description'] ?></div>
|
||||
</div>
|
||||
</li>
|
||||
<li style="height: 5px;"></li>
|
||||
<li>
|
||||
<a href="<?= $this->list_news[3]['url'] ?>">
|
||||
<div class="newsTop">
|
||||
<div class="newsTopLeft">
|
||||
<p><?= $this->list_news[3]['title'] ?></p>
|
||||
<div class="borBottom"></div>
|
||||
</div>
|
||||
<div class="rihgtTop">
|
||||
<span><?= date('d',strtotime($this->list_news[3]['ts_published'])) ?></span>
|
||||
<i><?= date('Y-m',strtotime($this->list_news[3]['ts_published'])) ?></i>
|
||||
</div>
|
||||
<li class="news-list-item col-sm-12">
|
||||
<div class="news-item-time"><span class="news-item-day"><?= date('d',strtotime($this->list_news[2]['ts_published'])) ?></span><br>
|
||||
<span class="news-item-month"><?= date('Y-m',strtotime($this->list_news[2]['ts_published'])) ?></span></div>
|
||||
<div class="news-item-text">
|
||||
<p>
|
||||
<a class="news-item-title customize-unpreviewable"
|
||||
href="<?= $this->list_news[2]['url'] ?>"><?= $this->list_news[2]['title'] ?></a>
|
||||
</p>
|
||||
<div class="news-item-content"><?= $this->list_news[2]['description'] ?></div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="news-list-item col-sm-12">
|
||||
<div class="news-item-time"><span class="news-item-day"><?= date('d',strtotime($this->list_news[3]['ts_published'])) ?></span><br>
|
||||
<span class="news-item-month"><?= date('Y-m',strtotime($this->list_news[3]['ts_published'])) ?></span></div>
|
||||
<div class="news-item-text">
|
||||
<p>
|
||||
<a class="news-item-title customize-unpreviewable" href="<?= $this->list_news[3]['url'] ?>"><?= $this->list_news[3]['title'] ?></a>
|
||||
</p>
|
||||
<div class="news-item-content">
|
||||
<?= $this->list_news[3]['description'] ?>
|
||||
</div>
|
||||
<div class="newsBottom">
|
||||
<p><?= $this->list_news[3]['description'] ?></p>
|
||||
<img src="/static-sanji-v2/img/rightArrow.png">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="news-list-item col-sm-12">
|
||||
<div class="news-item-time"><span class="news-item-day"><?= date('d',strtotime($this->list_news[4]['ts_published'])) ?></span><br>
|
||||
<span class="news-item-month"><?= date('Y-m',strtotime($this->list_news[4]['ts_published'])) ?></span></div>
|
||||
<div class="news-item-text">
|
||||
<p>
|
||||
<a class="news-item-title customize-unpreviewable" href="<?= $this->list_news[4]['url'] ?>"><?= $this->list_news[4]['title'] ?></a>
|
||||
</p>
|
||||
<div class="news-item-content"><?= $this->list_news[4]['description'] ?></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<!--最新数据-->
|
||||
<div class="backBg">
|
||||
<h3 class="navigation">
|
||||
<span>最新数据</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
|
||||
<!--统计-->
|
||||
<div class="analysis" style="height: 500px;">
|
||||
<div class="container">
|
||||
<div class="moreBox">
|
||||
<a href="" class="more">查看更多</a>
|
||||
<h6 class="title title1">统计图表</h6>
|
||||
<div class="col-md-7" id="zhuzhuang" style="height: 400px;padding-left: 0;">
|
||||
</div>
|
||||
<div class="row">
|
||||
<?php foreach($this->offlinemdtop as $i=>$md) : ?>
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<a href="/data/<?php echo $md->uuid; ?>" target="_blank">
|
||||
<div class="science p-box">
|
||||
<img src="/service/thumb/id/<?php echo $md->id; ?>" alt="">
|
||||
<div class="p-title">
|
||||
<p><?php echo $md->title; ?></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<div class="col-md-5 " id="bingtu" style="height: 400px;padding-right: 0;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--合作单位-->
|
||||
<h3 class="navigation">
|
||||
<span>合作单位</span>
|
||||
<dl></dl>
|
||||
</h3>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div id="myCarouse2" class="carousel carouse2 slide pad_010 b_k" data-ride="carousel">
|
||||
<ol class="carousel-indicators">
|
||||
<li data-target="#myCarouse2" data-slide-to="0" class="active"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="1"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="2"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="3"></li>
|
||||
<li data-target="#myCarouse2" data-slide-to="4"></li>
|
||||
</ol>
|
||||
<!-- 轮播(Carousel)项目 -->
|
||||
<div class="carousel-inner bor_btm">
|
||||
<div class="item active" >
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator32.jpg"><p>中国科学院青藏高原研究所</p>
|
||||
|
||||
<!--合作客户-->
|
||||
<div class="cooperator">
|
||||
<div class="container">
|
||||
<h6 class="title title1">合作客户</h6>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div id="myCarouse2" class="carousel carouse2 slide pad_010 b_k" data-ride="carousel"
|
||||
style="background: none;">
|
||||
<div class="carousel-inner bor_btm">
|
||||
<div class="item active">
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/1.jpg"/>中国科学院西北高原生物研究所</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator34.png"><p>中国科学院西北生态环境资源研究院</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/033.jpg"/>中国科学院光电研究院</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator35.jpg"><p>中国科学院遥感与数字地球研究所</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/1.jpg"/>青海省生态环境遥感监测中心</a>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator26.jpg"><p>中国科学院大气物理研究所</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/2.jpg"/>中科院寒区旱区环境与工程研究所</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator25.png"><p>中国科学院测量与地球物理研究所</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/3.jpg"/>中国科学院地理科学与资源研究所</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator28.jpg"><p>中国科学院地理科学与资源研究所</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/2.jpg"/>国科光电科技责任有限公司</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator29.jpg"><p>中国科学院地质与地球物理研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator30.jpg"><p>中国科学院东北地理与农业生态研究所</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator27.jpg"><p>中国科学院大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator33.jpg"><p>中国科学院上海天文台</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator2.jpg"><p>北京师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator23.jpg"><p>中国地质大学(武汉)</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator36.jpg"><p>中国科学院植物研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator31.jpg"><p>中国科学院南京地理与湖泊研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator19.jpg"><p>西北大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator20.png"><p>西南大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator18.png"><p>上海师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator3.jpg"><p>成都高原气象研究所</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator37.jpg"><p>中国气象科学研究院</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator22.jpg"><p>香港中文大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator24.jpg"><p>中国极地研究中心</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator16.png"><p>清华大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator4.jpg"><p>成都信息工程大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator21.jpg"><p>香港大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator14.jpg"><p>南方科技大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator9.jpg"><p>兰州大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator7.jpg"><p>西南科技大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator10.jpg"><p>美国德克萨斯大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator1.jpg"><p>北京林业大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator8.png"><p>华东师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator12.jpg"><p>美国加州大学洛杉矶分校</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator11.jpg"><p>美国华盛顿大学</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="pic">
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator13.png"><p>美国犹他大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator15.png"><p>挪威南森环境遥感中心</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator17.png"><p>瑞士苏黎世大学</p>
|
||||
</div>
|
||||
<div class="col-md-3 lastOne">
|
||||
<img src="/static-sanji/images/cooperator/cooperator1.jpg"><p>华东师范大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator5.jpg"><p>俄罗斯莫斯科州立大学</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<img src="/static-sanji/images/cooperator/cooperator6.png"><p>芬兰气象研究所</p>
|
||||
<div class="col-md-4 pic">
|
||||
<a href="javascript:;"><img src="/static-sanjy-np/img/banner01.jpg"/>中交星宇科技有限公司</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -495,4 +194,75 @@ $this->headLink()->appendStylesheet('/static-sanji-v2/css/index.css');
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var heiheCenter = [11056462.689530393, 4949375.549783349];
|
||||
var token = "pk.eyJ1IjoibGl1amluODM0IiwiYSI6ImEwMzZlMDUzZjZjYjc3MzI1ZDRmYWQyNDc3MzhlOTE0In0.MiWcDy0qLJHkBA_sCw9dHw";
|
||||
var mapboxSource = new ol.source.XYZ({
|
||||
url: 'https://api.mapbox.com/styles/v1/mapbox/satellite-streets-v10/tiles/256/{z}/{x}/{y}?access_token=' + token
|
||||
});
|
||||
var mapboxLayer = new ol.layer.Tile({
|
||||
title: "卫星图",
|
||||
source: mapboxSource,
|
||||
visible: true
|
||||
});
|
||||
var map = new ol.Map({
|
||||
target: 'map',
|
||||
layers: [
|
||||
mapboxLayer
|
||||
],
|
||||
controls: [],
|
||||
view: new ol.View({
|
||||
projection: 'EPSG:3857',
|
||||
center: heiheCenter,
|
||||
loadTilesWhileAnimating: true,
|
||||
zoom: 7
|
||||
})
|
||||
});
|
||||
var map = new ol.Map({
|
||||
target: 'map1',
|
||||
layers: [
|
||||
mapboxLayer
|
||||
],
|
||||
controls: [],
|
||||
view: new ol.View({
|
||||
projection: 'EPSG:3857',
|
||||
center: heiheCenter,
|
||||
loadTilesWhileAnimating: true,
|
||||
zoom: 7
|
||||
})
|
||||
});
|
||||
|
||||
function lineStyle(color, width) {
|
||||
return new ol.style.Style({
|
||||
stroke: new ol.style.Stroke({
|
||||
color: color,
|
||||
width: width
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
let heiheBoundLayer = new ol.layer.Vector({
|
||||
source: new ol.source.Vector({
|
||||
url: 'http://210.77.68.221:10011/geojson/heihe.geojson',
|
||||
format: new ol.format.GeoJSON()
|
||||
}),
|
||||
style: lineStyle('rgba(53, 100, 175, 1)', 5)
|
||||
});
|
||||
map.addLayer(heiheBoundLayer);
|
||||
|
||||
/*新闻轮播图时间控制*/
|
||||
$('.carousel2').carousel({
|
||||
interval: 1500
|
||||
})
|
||||
</script>
|
||||
|
||||
<script src="/static-sanjy-np/js/echarts.min.js"></script>
|
||||
<script src="/static-sanjy-np/js/mychart.js"></script>
|
||||
<script type="text/javascript">
|
||||
/*新闻轮播图时间控制*/
|
||||
$('.carousel2').carousel({
|
||||
interval: 1500
|
||||
})
|
||||
</script>
|
||||
|
|
|
@ -1,29 +1,48 @@
|
|||
<!--底部copyright-->
|
||||
<div class="copyright">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="copyrightContent col-sm-12">
|
||||
<div class="copyrightContentL">
|
||||
<p style="margin-bottom: 15px;" class="title">联系方式</p>
|
||||
<span><img src="/static-sanji-v2/img/icon_address.png">中国科学院寒区环境与</span>
|
||||
<span style="margin-left: 23px;">工程研究院 6#1102</span>
|
||||
<span><img src="/static-sanji-v2/img/icon_phone.png">0931-4967287</span>
|
||||
<span><img src="/static-sanji-v2/img/icon_email.png">westdc@lzb.ac.cn</span>
|
||||
</div>
|
||||
<div class="copyrightContentR">
|
||||
<p style="margin-bottom: 15px;" class="title">帮助信息</p>
|
||||
<span><a href="#">如何申请数据</a></span>
|
||||
<span><a href="/archives/help/platform/archive-23.html">科学数据引用建议</a></span>
|
||||
<span><a href="#">联系我们</a></span>
|
||||
</div>
|
||||
<div class="borderOne">
|
||||
<p style="height:5px;"></p>
|
||||
</div>
|
||||
<div class="bottomDiv">
|
||||
<p class="left">时空三极环境大数据平台 © 2018 陇ICP备05000491号</p>
|
||||
<p class="right"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-10">
|
||||
<ul class="col-md-4">
|
||||
<li class="first">联系我们</li>
|
||||
<li>地址:高新大厦高新大厦高新大厦</li>
|
||||
<li>Email:14-4-34@qq.com</li>
|
||||
<li>weibo:
|
||||
<a href="">eqeqqr</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="col-md-3">
|
||||
<li class="first">快速导航</li>
|
||||
<li>
|
||||
<a href="../index.html">首页</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="data.html">数据</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="news.html">新闻动态</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="aboutUs.html">关于我们</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="col-md-3">
|
||||
<li class="first">友情链接</li>
|
||||
<li>
|
||||
<a href="">公司1公司1公司1公司1公司1公司1公司1公司1公司1公司1公司1公司1</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">公司2</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">公司3</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<img src="/static-sanjy-np/img/timg.gif" />
|
||||
</div>
|
||||
<div class="bottomOne">
|
||||
<p>Copyright © 2004-2011 DEDECMS. 数云科技 版权所有 技术支持</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,41 @@
|
|||
<!--顶部导航-->
|
||||
<header class="header">
|
||||
<div class="container">
|
||||
<nav class="navbar navbar-inverse" role="navigation">
|
||||
<div class="navbar-header">
|
||||
<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav">
|
||||
<span class="sr-only"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a href="#" class="navbar-brand scroll-top logo"><img src="/static-sanji-v2/img/logo_white.png" alt="" /><b>时空三极环境大数据平台</b></a>
|
||||
</div>
|
||||
<div id="main-nav" class="collapse navbar-collapse">
|
||||
<ul class="nav navbar-nav" id="mainNav">
|
||||
<li ><a href="/">首页</a></li>
|
||||
<li><a href="/data" class="scroll-link">数据产品</a></li>
|
||||
<li><a href="/archives/news/localnews" class="scroll-link">新闻动态</a></li>
|
||||
<li><a href="/about" class="scroll-link">关于本站</a></li>
|
||||
<li><a href="/author" class="scroll-link">数据提交</a></li>
|
||||
<li class="search">
|
||||
<form action="/search" id="search-form">
|
||||
<input type="text" name="q" id="q" class="form-control" placeholder="搜索">
|
||||
<i onclick="$('#search-form').submit()"></i>
|
||||
</form>
|
||||
</li>
|
||||
<?php
|
||||
$auth = Zend_Auth::getInstance();
|
||||
if($auth->hasIdentity())
|
||||
{
|
||||
echo '<li><a href="/data/order">数据篮</a></li>';
|
||||
} else {
|
||||
echo '<li id="login" onclick="self.location = \'/account/login\'">登录</li>';
|
||||
} ?>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
</header>
|
|
@ -1,41 +1,58 @@
|
|||
<!--顶部导航-->
|
||||
<div class="pageTitle">
|
||||
<div class="container">
|
||||
<div class="col-md-8" style="padding-left: 0;">
|
||||
<img src="/static-sanjy-np/img/logo3_03.png" alt="" style="width: 75px;float: left;margin-right: 10px;" />
|
||||
<h5>三江源国家公园星空地一体化生态监测及数据平台</h5>
|
||||
<span>Integrated monitoring and data platform for Sanjiang Star source National Park</span>
|
||||
</div>
|
||||
<div class="col-md-4 searchBox" style="padding-right: 0;">
|
||||
<i>搜索</i>
|
||||
<input type="text" placeholder="请输入搜索内容" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<header class="header">
|
||||
<div class="container">
|
||||
<nav class="navbar navbar-inverse" role="navigation">
|
||||
<div class="navbar-header">
|
||||
<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav">
|
||||
<span class="sr-only"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a href="#" class="navbar-brand scroll-top logo"><img src="/static-sanji-v2/img/logo_white.png" alt="" /><b>时空三极环境大数据平台</b></a>
|
||||
</div>
|
||||
<div id="main-nav" class="collapse navbar-collapse">
|
||||
<ul class="nav navbar-nav" id="mainNav">
|
||||
<li ><a href="/">首页</a></li>
|
||||
<li><a href="/data" class="scroll-link">数据产品</a></li>
|
||||
<li><a href="/archives/news/localnews" class="scroll-link">新闻动态</a></li>
|
||||
<li><a href="/about" class="scroll-link">关于本站</a></li>
|
||||
<li><a href="/author" class="scroll-link">数据提交</a></li>
|
||||
<li class="search">
|
||||
<form action="/search" id="search-form">
|
||||
<input type="text" name="q" id="q" class="form-control" placeholder="搜索">
|
||||
<i onclick="$('#search-form').submit()"></i>
|
||||
</form>
|
||||
</li>
|
||||
<?php
|
||||
$auth = Zend_Auth::getInstance();
|
||||
if($auth->hasIdentity())
|
||||
{
|
||||
echo '<li><a href="/data/order">数据篮</a></li>';
|
||||
} else {
|
||||
echo '<li id="login" onclick="self.location = \'/account/login\'">登录</li>';
|
||||
} ?>
|
||||
</ul>
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container-fluid" style="padding-left: 0;">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
|
||||
<span class="sr-only">切换导航</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="example-navbar-collapse" style="padding-left: 0;">
|
||||
<ul class="nav navbar-nav">
|
||||
<li>
|
||||
<a href="/" class="active">首页</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/data">数据服务</a>
|
||||
</li>
|
||||
<!--<li>
|
||||
<a href="html/data.html">遥感算法</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="html/data.html">实时数据</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="html/data.html">数据汇交</a>
|
||||
</li>-->
|
||||
<li>
|
||||
<a href="/archives">新闻动态</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="html/aboutUs.html">关于我们</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="" id="register">注册</a>
|
||||
<a href="" id="login">登录</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
</header>
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<?= $this->headTitle() ?>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/top.css" />
|
||||
<script src="/static-sanji-v2/js/jquery.min.js"></script>
|
||||
<script src="/static-sanji-v2/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="/static-sanji-v2/js/org.min.js" data-main="indexMain"></script>
|
||||
<?= $this->headScript() ?>
|
||||
<?= $this->headLink() ?>
|
||||
<?= $this->headStyle() ?>
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/bottom.css" />
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/number.css" />
|
||||
<link rel="shortcut icon" href="/favicon.ico" />
|
||||
<link rel="alternate" type="application/rss+xml" title="WestDC RSS Feed" href="/data/feed" />
|
||||
<!--[if lte IE 9]>
|
||||
<script>
|
||||
window.location = '/html/browsers.html';
|
||||
</script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<?= $this->render('sanji-header.phtml') ?>
|
||||
<!--<div class="breadcrumb"><?= $this->breadcrumb() ?> </div>-->
|
||||
<?= $this->layout()->content ?>
|
||||
<?= $this->render('sanji-footer.phtml') ?>
|
||||
</body>
|
||||
<script>setPage();</script>
|
||||
</html>
|
|
@ -1,32 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<head>
|
||||
<?= $this->headTitle() ?>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/top.css" />
|
||||
<script src="/static-sanji-v2/js/jquery.min.js"></script>
|
||||
<script src="/static-sanji-v2/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="/static-sanji-v2/js/org.min.js" data-main="indexMain"></script>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<link rel="stylesheet" href="/static-sanjy-np/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="/static-sanjy-np/photoswipe/photoswipe.css"/>
|
||||
<link rel="stylesheet" href="/static-sanjy-np/photoswipe/default-skin/default-skin.css"/>
|
||||
<script src="/static-sanjy-np/js/jquery.min.js"></script>
|
||||
<script src="/static-sanjy-np/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="/static-sanjy-np/map/statics/ol.js" data-main="indexMain"></script>
|
||||
<?= $this->headScript() ?>
|
||||
<?= $this->headLink() ?>
|
||||
<?= $this->headStyle() ?>
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/bottom.css" />
|
||||
<link rel="stylesheet" href="/static-sanji-v2/css/number.css" />
|
||||
<link rel="shortcut icon" href="/favicon.ico" />
|
||||
<link rel="alternate" type="application/rss+xml" title="WestDC RSS Feed" href="/data/feed" />
|
||||
|
||||
<link rel="shortcut icon" href="/favicon.ico"/>
|
||||
<link rel="alternate" type="application/rss+xml" title="WestDC RSS Feed" href="/data/feed"/>
|
||||
<!--[if lte IE 9]>
|
||||
<script>
|
||||
window.location = '/html/browsers.html';
|
||||
window.location = '/html/browsers.html';
|
||||
</script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<?= $this->render('sanji-header.phtml') ?>
|
||||
<!--<div class="breadcrumb"><?= $this->breadcrumb() ?> </div>-->
|
||||
<?= $this->layout()->content ?>
|
||||
<?= $this->render('sanji-footer.phtml') ?>
|
||||
</body>
|
||||
<script>setPage();</script>
|
||||
</head>
|
||||
<body>
|
||||
<?= $this->render('sanji-header.phtml') ?>
|
||||
<!--<div class="breadcrumb"><?= $this->breadcrumb() ?> </div>-->
|
||||
<?= $this->layout()->content ?>
|
||||
<?= $this->render('sanji-footer.phtml') ?>
|
||||
</body>
|
||||
<script>setPage();</script>
|
||||
</html>
|
|
@ -0,0 +1,643 @@
|
|||
|
||||
.breadcrumb-wrapper {
|
||||
background: #F4F4F4;
|
||||
padding: 20px 0;
|
||||
clear: both;
|
||||
}
|
||||
.breadcrumb-section .bc-cat {
|
||||
padding-top: 16px;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
.bcid-cat {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.location {
|
||||
text-align: right;
|
||||
}
|
||||
.location img{
|
||||
width: 18px;
|
||||
margin-right:2px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
.breadcrumb-wrapper a{
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
.copyright{
|
||||
background: #282F36;
|
||||
color: #999999;
|
||||
padding: 30px 0 20px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
.copyright ul li{
|
||||
font-size: 14px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.copyright ul li a{
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
}
|
||||
.copyright ul li a:hover{
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
.copyright ul li.first{
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.bottomOne{
|
||||
clear: both;
|
||||
border-top: 1px solid #666;
|
||||
text-align: center;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.searchBox {
|
||||
overflow: hidden;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.searchBox input {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border: 1px solid #54a1f7;
|
||||
border-radius: 4px;
|
||||
border-right: none;
|
||||
float: right;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
padding: 0 10px;
|
||||
outline: none;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.searchBox i {
|
||||
display: block;
|
||||
float: right;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border: 1px solid #54a1f7;
|
||||
border-radius: 4px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
width: 20%;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
cursor: pointer;
|
||||
background: #54a1f7;
|
||||
color: #FFFFFF;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.searchBox:hover i{
|
||||
background: #124076;
|
||||
border: 1px solid #124076;
|
||||
}
|
||||
.searchBox:hover input{
|
||||
border: 1px solid #124076;
|
||||
border-right: none;
|
||||
}
|
||||
.content h6{
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.widget .title {
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
margin-bottom: 22px;
|
||||
margin-top: 0;
|
||||
}
|
||||
.widget-list{
|
||||
padding: 0;
|
||||
}
|
||||
.widget ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
}
|
||||
.widget ul li ul li:last-child {
|
||||
border-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.widget .gallery-post-slider ul li {
|
||||
border: none;
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
.widget .tabbed .tabs {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.widget .tabbed .tabs li {
|
||||
float: left;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
background-image: none;
|
||||
border: none;
|
||||
padding: 10px 1px 10px;
|
||||
width: 33.333%;
|
||||
color: #878c90;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
text-transform: uppercase;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
border-right: 1px solid #d3dae0;
|
||||
}
|
||||
.widget .tabbed .tabs li:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
.widget .tabbed .tabs li:hover, .widget .tabbed .tabs li.current {
|
||||
color: #ffffff;
|
||||
background-color: #f16543;
|
||||
border-right: 1px solid #f16543;
|
||||
border-bottom: 1px solid #f16543;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
.widget .tabbed .block {
|
||||
margin: 0;
|
||||
display: none;
|
||||
}
|
||||
.widget .tabbed .block.current {
|
||||
display: block;
|
||||
padding: 22px 0 0;
|
||||
border-top: 1px solid #d3dae0;
|
||||
}
|
||||
.widget .tabbed .widget-list li {
|
||||
background: none;
|
||||
border-bottom: 1px solid #E8E9EF;
|
||||
padding: 0 0 20px;
|
||||
margin-bottom: 25px;
|
||||
line-height: 1.0;
|
||||
}
|
||||
.widget .tabbed .widget-list li .link-read-more {
|
||||
color: #f16543;
|
||||
}
|
||||
.widget .tabbed .widget-list li .link-read-more:hover {
|
||||
color: #373c40;
|
||||
}
|
||||
.widget .tabbed .widget-list li .link-read-more:hover:after {
|
||||
color: #373c40;
|
||||
}
|
||||
.widget-list li {
|
||||
overflow: hidden;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.widget-list li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.widget-list li h5 {
|
||||
margin: 0 0 9px;
|
||||
line-height: 21px;
|
||||
color: #a5aaae;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.widget-list li figure {
|
||||
float: left;
|
||||
margin-right: 22px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.widget-list li figure img {
|
||||
width: 102px;
|
||||
height: 70px;
|
||||
}
|
||||
.widget-list li span {
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left 3px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 7px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.widget-list li span img{
|
||||
width: 15px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.widget-list li .comments {
|
||||
background-image: url("../images/icon-chat-3.png");
|
||||
background-position: left 3px;
|
||||
margin-right: 18px;
|
||||
margin-bottom: 0;
|
||||
color: #666666;
|
||||
}
|
||||
.widget-list li .author {
|
||||
background-image: url("../images/icon-user.png");
|
||||
background-position: left 3px;
|
||||
padding-left: 17px;
|
||||
}
|
||||
.widget-list li .link-read-more {
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
}
|
||||
.widget-list li .link-read-more:after {
|
||||
content: " \f101";
|
||||
font-family: FontAwesome;
|
||||
color: #f16543;
|
||||
}
|
||||
.widget .tagcloud {
|
||||
overflow: hidden;
|
||||
margin-left: -4px;
|
||||
margin-right: -4px;
|
||||
}
|
||||
.widget .tagcloud a {
|
||||
display: block;
|
||||
float: left;
|
||||
padding: 6px 15px;
|
||||
color: #84898b;
|
||||
background-color: #ecf0f3;
|
||||
font-size: 14px;
|
||||
margin: 4px;
|
||||
text-decoration: none;
|
||||
}
|
||||
.widget .tagcloud a:hover {
|
||||
color: #ffffff;
|
||||
background: #f16543;
|
||||
}
|
||||
.sn-wrapper p a{
|
||||
color:#333333 ;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
.sn-wrapper p a:hover{
|
||||
text-decoration: none;
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
.txtLeft img{
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
margin-top:20px;
|
||||
}
|
||||
.txtLeft p{
|
||||
font-size: 14px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
/*新闻*/
|
||||
.blog-article {
|
||||
float: left;
|
||||
width: 100%;
|
||||
}
|
||||
.blog-article figure {
|
||||
float: left;
|
||||
width: 250px;
|
||||
margin-right: 25px;
|
||||
margin-bottom: 10px;
|
||||
height: 136px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.blog-article .post-meta ul {
|
||||
padding: 0;
|
||||
}
|
||||
.downlist-wrap .blog-article figure {
|
||||
width: 220px;
|
||||
margin-right: 25px;
|
||||
}
|
||||
.download-wrap .d-content {
|
||||
padding-top: 15px;
|
||||
}
|
||||
.download-wrap .down-info li {
|
||||
padding-bottom: 12px;
|
||||
margin-bottom: 12px;
|
||||
border-bottom: 1px #ddd solid;
|
||||
}
|
||||
.blog-post-wrap .bp-desc {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin: 20px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
.blog-post-wrap .bp-title {
|
||||
margin-top: 0;
|
||||
font-size: 23px;
|
||||
letter-spacing: normal;
|
||||
color: inherit;
|
||||
text-align: center;
|
||||
}
|
||||
.blog-article {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.blog-article figure {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.blog-article .format-icon {
|
||||
left: 0;
|
||||
}
|
||||
.blog-article p {
|
||||
margin-bottom: 20px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.blog-article blockquote p {
|
||||
line-height: 32px;
|
||||
}
|
||||
.blog-article .read-more-link {
|
||||
text-transform: uppercase;
|
||||
line-height: 23px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
border: 1px solid #54a1f7;
|
||||
color: #54a1f7;
|
||||
}
|
||||
.blog-article .read-more-link:hover {
|
||||
background: #54a1f7 ;
|
||||
color: #FFFFFF!important;
|
||||
border: 1px solid #54a1f7;
|
||||
text-decoration: none;
|
||||
}
|
||||
.blog-article .post-meta {
|
||||
color: #a5aaae;
|
||||
font-size: 12px;
|
||||
float: left;
|
||||
width: 120px;
|
||||
border-right: 2px solid #d7dee0;
|
||||
margin: 5px 30px 15px 0;
|
||||
}
|
||||
.blog-article .post-meta a {
|
||||
color: #a5aaae;
|
||||
}
|
||||
.blog-article .post-meta a:hover {
|
||||
color: #f16543;
|
||||
}
|
||||
.blog-article .post-meta ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0 15px;
|
||||
}
|
||||
.blog-article .post-meta ul li {
|
||||
margin: 0 0 6px;
|
||||
padding: 4px 0;
|
||||
text-transform: uppercase;
|
||||
background: none;
|
||||
}
|
||||
.blog-article .post-summary {
|
||||
padding-right: 10px;
|
||||
}
|
||||
.blog-article .post-summary p {
|
||||
margin-bottom: 10px;
|
||||
line-height: 23px;
|
||||
color: #666;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
}
|
||||
.blog-article .post-content-wrapper {
|
||||
padding: 15px 0 30px;
|
||||
}
|
||||
.blog-article .post-meta ul li time {
|
||||
background: none;
|
||||
margin-left: -3px;
|
||||
}
|
||||
h2.post-title {
|
||||
font-size: 18px;
|
||||
letter-spacing: normal;
|
||||
margin-top: 0;
|
||||
margin-bottom: 12px;
|
||||
line-height: 1.4;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.post-meta li i{
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 5px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
.post-meta li i.time{
|
||||
background: url(../img/icon2.png) no-repeat center;
|
||||
background-size:100% ;
|
||||
}
|
||||
.post-meta li i.icon1{
|
||||
background: url(../img/icon3.png) no-repeat center;
|
||||
background-size:100% ;
|
||||
}
|
||||
.format-image img{
|
||||
width: 100%;
|
||||
height: 136px;
|
||||
-webkit-transition:all 0.25s ease-in-out;
|
||||
-moz-transition:all 0.25s ease-in-out;
|
||||
-o-transition:all 0.25s ease-in-out;
|
||||
-ms-transition:all 0.25s ease-in-out;
|
||||
transition:all 0.25s ease-in-out;
|
||||
}
|
||||
.format-image:hover img{
|
||||
opacity: 1;
|
||||
transform: scale(1.15,1.15);
|
||||
-webkit-transform:scale(1.15,1.15);
|
||||
-moz-transform:scale(1.15,1.15);
|
||||
-ms-transform:scale(1.15,1.15);
|
||||
-o-transform:scale(1.15,1.15);
|
||||
}
|
||||
|
||||
.pagination-wrap{
|
||||
float: right;
|
||||
}
|
||||
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{
|
||||
background: #54a1f7;
|
||||
border: 1px solid #54a1f7;
|
||||
}
|
||||
.pagination>li>a, .pagination>li>span{
|
||||
color: #54a1f7;
|
||||
}
|
||||
.format-image:hover h2{
|
||||
color: #54a1f7;
|
||||
}
|
||||
.format-image:hover .read-more-link{
|
||||
color: #54a1f7;
|
||||
}
|
||||
.content1{
|
||||
padding-top: 20px;
|
||||
}
|
||||
.t_big{
|
||||
color:#124076;
|
||||
}
|
||||
.t_big1{
|
||||
color:#54a1f7;
|
||||
text-transform:uppercase;
|
||||
}
|
||||
ul.in_list{
|
||||
margin-top:36px;
|
||||
padding: 0;
|
||||
}
|
||||
ul.in_list a{
|
||||
display:block;
|
||||
width:90%;
|
||||
height:40px;
|
||||
padding-left:20px;
|
||||
line-height:40px;
|
||||
border-bottom:1px solid #E6E6E6;
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
}
|
||||
ul.in_list a.active{
|
||||
width:90%;
|
||||
color:#fff;
|
||||
background-color:#54a1f7;
|
||||
}
|
||||
ul.in_list a:hover{
|
||||
width:90%;
|
||||
color:#fff;
|
||||
background-color:#54a1f7;
|
||||
}
|
||||
|
||||
.in_phone{
|
||||
background:url(../img/in_phone.jpg) no-repeat left center;
|
||||
text-align: left;
|
||||
padding-left: 70px;
|
||||
font-family:Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.y_1{
|
||||
font-size:18px;
|
||||
margin: 0;
|
||||
}
|
||||
.y_2{
|
||||
color:#ccc;
|
||||
font-size:10px;
|
||||
display: block;
|
||||
}
|
||||
.float_l{
|
||||
border: 1px solid #E6E6E6;
|
||||
margin-top: 20px;
|
||||
padding-left: 5%;
|
||||
padding-bottom: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.copyright img {
|
||||
width: 120px;
|
||||
float: right;
|
||||
}
|
||||
.inner-left h3{
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #124076;
|
||||
}
|
||||
.inner-left img{
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#about2 ul{
|
||||
padding-left: 15px;
|
||||
}
|
||||
#about2 ul li{
|
||||
list-style: circle;
|
||||
}
|
||||
.guanjian a{
|
||||
color: #666;
|
||||
font-size: 12px;
|
||||
background: #EEEEEE;
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.newUlList {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.newUlList li {
|
||||
overflow: hidden;
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
|
||||
.newUlList li:last-of-type {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.newUlList li .newsImgBox {
|
||||
width: 270px;
|
||||
height: 135px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
border: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
.newUlList li span{
|
||||
-webkit-transition: all 0.4s ease-in-out;
|
||||
-moz-transition: all 0.4s ease-in-out;
|
||||
-o-transition: all 0.4s ease-in-out;
|
||||
-ms-transition: all 0.4s ease-in-out;
|
||||
transition: all 0.4s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.newUlList li:hover span{
|
||||
transform: translate3d(10px, 0, 0);
|
||||
-moz-transform: translate3d(10px, 0, 0);
|
||||
-webkit-transform: translate3d(10px, 0, 0);
|
||||
transition: all .3s ease-out 0s;
|
||||
color: #2b91f1;
|
||||
}
|
||||
.newUlList li:hover a.more{
|
||||
border: 1px solid #2b91f1;
|
||||
color: #2b91f1;
|
||||
}
|
||||
.newUlList li .newRight {
|
||||
float: right;
|
||||
width: 550px;
|
||||
}
|
||||
|
||||
.newTopTitle {
|
||||
overflow: hidden;
|
||||
margin: 0 0 15px;
|
||||
}
|
||||
.newTopTitle span{
|
||||
color: #333;
|
||||
font-size: 18px;
|
||||
width: 80%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow:ellipsis;
|
||||
display: inline-block;
|
||||
}
|
||||
.newTopTitle i {
|
||||
display: block;
|
||||
float: right;
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.newRight p {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
text-align: justify;
|
||||
height: 56px;
|
||||
margin: 0;
|
||||
}
|
||||
.newRight a.more {
|
||||
float: right;
|
||||
display: block;
|
||||
width: 90px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border: 1px solid #e6e6e6;
|
||||
color: #9f9f9f;
|
||||
font-size: 12px;
|
||||
margin-top: 10px;
|
||||
border-radius: 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
-ms-border-radius: 4px;
|
||||
-o-border-radius: 4px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
.guanjian{
|
||||
margin-bottom: 20px;
|
||||
}
|
|
@ -0,0 +1,71 @@
|
|||
.dataContent img{
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.dataContent p{
|
||||
margin-top: 20px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.leftBox h5{
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
}
|
||||
.leftBox p.englishTitle{
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.smallSize span a{
|
||||
color:#54a1f7 ;
|
||||
font-size: 12px;
|
||||
}
|
||||
.leftBox{
|
||||
margin-top: 30px;
|
||||
}
|
||||
.leftBox .label-info{
|
||||
background: #54a1f7;
|
||||
}
|
||||
.spaceLocation{
|
||||
height: 400px;
|
||||
border: 1px solid #CCCCCC;
|
||||
}
|
||||
.spaceLocation img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.rightOne ul{
|
||||
padding-left: 20px;
|
||||
}
|
||||
.rightOne ul li{
|
||||
list-style: circle;
|
||||
}
|
||||
.rightOne a{
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
#myTabContent {
|
||||
border: 1px solid #E6E6E6;
|
||||
border-top: none;
|
||||
padding: 10px 15px;
|
||||
margin-bottom: 30px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#myTab {
|
||||
margin-top: 25px;
|
||||
}
|
||||
#myTab li a:hover{
|
||||
background: #EEEEEE;
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
.addBtn{
|
||||
display: block;
|
||||
background: #54a1f7;
|
||||
color: #FFFFFF!important;
|
||||
padding: 8px 10px;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
.addBtn:hover{
|
||||
color: #FFFFFF;
|
||||
background: #54adfa;
|
||||
}
|
|
@ -0,0 +1,748 @@
|
|||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
ul,
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.pageTop {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background: #efefef;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.pageTop span i {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: 4px;
|
||||
background: url(../img/phone.png) no-repeat center;
|
||||
background-size: 50%;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.rightBox {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.rightBox a {
|
||||
display: block;
|
||||
width: 60px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
margin-top: 5px;
|
||||
font-size: 14px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
#login {
|
||||
float: right;
|
||||
color: #FFFFFF;
|
||||
line-height: 25px;
|
||||
margin-right: 20px;
|
||||
border: 1px solid #FFFFFF;
|
||||
display: block;
|
||||
padding: 0 10px;
|
||||
border-radius: 4px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
#login:hover {
|
||||
color:#54a1f7 ;
|
||||
border: 1px solid #54a1f7;
|
||||
}
|
||||
|
||||
#register:hover {
|
||||
color:#54a1f7 ;
|
||||
border: 1px solid #54a1f7;
|
||||
}
|
||||
|
||||
#register {
|
||||
float: right;
|
||||
color: #FFFFFF;
|
||||
line-height: 25px;
|
||||
border: 1px solid #FFFFFF;
|
||||
display: block;
|
||||
padding: 0 10px;
|
||||
border-radius: 4px;
|
||||
margin-top: 7px;
|
||||
margin-right: -30px;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: #124076;
|
||||
height: 40px;
|
||||
}
|
||||
/*深色*/
|
||||
.navbar-default {
|
||||
background: #124076;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
-moz-border-radius: 0;
|
||||
}
|
||||
|
||||
.nav>li>a {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
position: relative;
|
||||
min-height: 40px;
|
||||
height: 40px;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a:focus,
|
||||
.navbar-default .navbar-nav>li>a:hover {
|
||||
background: #54a1f7;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.navbar-toggle {
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
.pageTitle h5 {
|
||||
font-size: 30px;
|
||||
font-family: "微软雅黑";
|
||||
margin: 0;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
padding: 30px 0;
|
||||
background: url(../img/top4.jpg) no-repeat top center;
|
||||
background-size:cover;
|
||||
}
|
||||
|
||||
.pageTitle .col-md-8 span {
|
||||
font-size: 14px;
|
||||
font-family:"微软雅黑";
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.navbar-nav a {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.navbar-nav a.active {
|
||||
background: #54a1f7;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.carousel-inner>.item>a>img,
|
||||
.carousel-inner>.item>img,
|
||||
.img-responsive,
|
||||
.thumbnail a>img,
|
||||
.thumbnail>img {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.searchBox {
|
||||
overflow: hidden;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.searchBox input {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border: 1px solid #CCCCCC;
|
||||
border-radius: 4px;
|
||||
border-right: none;
|
||||
float: right;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
padding: 0 10px;
|
||||
outline: none;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.searchBox i {
|
||||
display: block;
|
||||
float: right;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border: 1px solid #124076;
|
||||
border-radius: 4px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
width: 20%;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
cursor: pointer;
|
||||
background: #124076;
|
||||
color: #FFFFFF;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.searchBox i:hover {
|
||||
background: #54a1f7;
|
||||
border: 1px solid #54a1f7;
|
||||
}
|
||||
|
||||
|
||||
/*最新数据*/
|
||||
|
||||
.team-wrap {
|
||||
margin: 0;
|
||||
position: relative;
|
||||
height: 300px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #E6E6E6;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.team-wrap h4 {
|
||||
color: #32313b;
|
||||
font-weight: 500;
|
||||
margin-bottom: 0;
|
||||
overflow: hidden;
|
||||
line-height: 1.5em;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.team-wrap span.designation {
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
color: #54a1f7;
|
||||
font-size: 16px;
|
||||
line-height: 2em;
|
||||
text-transform: capitalize;
|
||||
width: 90%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 5%;
|
||||
}
|
||||
|
||||
.team-wrap .team-img {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.team-wrap .team-img img {
|
||||
height: 185px;
|
||||
display: block;
|
||||
position: relative;
|
||||
-webkit-transition: -webkit-transform 0.4s;
|
||||
-moz-transition: -moz-transform 0.4s;
|
||||
transition: transform 0.4s;
|
||||
}
|
||||
|
||||
.team-social {
|
||||
padding: 7px;
|
||||
background: #54a1f7;
|
||||
color: #ed4e6e;
|
||||
position: absolute;
|
||||
height: 42px;
|
||||
width: 100%;
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
opacity: 1;
|
||||
-webkit-transform: translateY(100%);
|
||||
-moz-transform: translateY(100%);
|
||||
-ms-transform: translateY(100%);
|
||||
transform: translateY(100%);
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
|
||||
-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
|
||||
transition: transform 0.4s, opacity 0.1s 0.3s;
|
||||
}
|
||||
|
||||
.team-social a {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: 2px solid #fff;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 3px;
|
||||
position: relative;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
-o-border-radius: 4px;
|
||||
-ms-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.team-social a i {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
display: block;
|
||||
background: url(../img/eye.png) no-repeat center;
|
||||
background-size: 100%;
|
||||
margin: 4px 3px;
|
||||
}
|
||||
|
||||
.team-wrap:hover img {
|
||||
-webkit-transform: translateY(-30px);
|
||||
-moz-transform: translateY(-30px);
|
||||
-ms-transform: translateY(-30px);
|
||||
transform: translateY(-30px);
|
||||
}
|
||||
|
||||
.team-content p {
|
||||
width: 100%;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.team-wrap:hover .team-social {
|
||||
opacity: 1;
|
||||
-webkit-transform: translateY(0px);
|
||||
-moz-transform: translateY(0px);
|
||||
-ms-transform: translateY(0px);
|
||||
transform: translateY(0px);
|
||||
-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
|
||||
-moz-transition: -moz-transform 0.4s, opacity 0.1s;
|
||||
transition: transform 0.4s, opacity 0.1s;
|
||||
}
|
||||
|
||||
.newData {
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
|
||||
.carousel {
|
||||
background: #EFEFEF;
|
||||
}
|
||||
.newData .more{
|
||||
position: absolute;
|
||||
right: 17px;
|
||||
top: 30px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.newData .more:hover{
|
||||
color: #54a1f7;
|
||||
}
|
||||
.title {
|
||||
height: 55px;
|
||||
width:400px;
|
||||
text-align: center;
|
||||
line-height: 35px;
|
||||
color: #124076;
|
||||
font-size: 28px;
|
||||
margin: 20px auto;
|
||||
}
|
||||
|
||||
.title1 {
|
||||
background: url(../img/title.png) no-repeat center 40px ;
|
||||
background-size: 60%;
|
||||
}
|
||||
|
||||
|
||||
/*图集*/
|
||||
#main {
|
||||
width: 1140px;
|
||||
height: 460px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mindiv {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.divbox {
|
||||
width: 100%;
|
||||
height: 200%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
.divbox .boxone {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.divbox .boxtwo {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
}
|
||||
#main figure{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#main .img-dv{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#min_1 {
|
||||
width: 150px;
|
||||
height: 230px;
|
||||
background: #BF1D1A;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
#main img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor:crosshair;
|
||||
}
|
||||
#min_2 {
|
||||
width: 190px;
|
||||
height: 270px;
|
||||
background: #2DC3C2;
|
||||
top: 0px;
|
||||
left: 150px;
|
||||
}
|
||||
|
||||
#min_3 {
|
||||
width: 245px;
|
||||
height: 135px;
|
||||
background: #2DC3C2;
|
||||
top: 0px;
|
||||
left: 340px;
|
||||
}
|
||||
|
||||
#min_4 {
|
||||
width: 245px;
|
||||
height: 135px;
|
||||
background: #E34546;
|
||||
top: 135px;
|
||||
left: 340px;
|
||||
}
|
||||
|
||||
#min_5 {
|
||||
width: 180px;
|
||||
height: 135px;
|
||||
background: #F0640F;
|
||||
top: 0px;
|
||||
left: 585px;
|
||||
}
|
||||
|
||||
#min_6 {
|
||||
width: 180px;
|
||||
height: 135px;
|
||||
background: #F2AB03;
|
||||
top: 135px;
|
||||
left: 585px;
|
||||
}
|
||||
|
||||
#min_7 {
|
||||
width: 185px;
|
||||
height: 185px;
|
||||
background: #06B6A1;
|
||||
top: 0px;
|
||||
left: 765px;
|
||||
}
|
||||
|
||||
#min_8 {
|
||||
width: 150px;
|
||||
height: 230px;
|
||||
background: #2F2F2F;
|
||||
top: 230px;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
#min_9 {
|
||||
width: 250px;
|
||||
height: 190px;
|
||||
background: #8F8669;
|
||||
top: 270px;
|
||||
left: 150px;
|
||||
}
|
||||
|
||||
#min_10 {
|
||||
width: 185px;
|
||||
height: 190px;
|
||||
background: #85B32F;
|
||||
top: 270px;
|
||||
left: 400px;
|
||||
}
|
||||
|
||||
#min_11 {
|
||||
width: 180px;
|
||||
height: 190px;
|
||||
background: #CCCCCC;
|
||||
top: 270px;
|
||||
left: 585px;
|
||||
}
|
||||
|
||||
#min_12 {
|
||||
width: 185px;
|
||||
height: 275px;
|
||||
background: #CB266B;
|
||||
top: 185px;
|
||||
left: 765px;
|
||||
}
|
||||
#min_13 {
|
||||
width: 200px;
|
||||
height: 500px;
|
||||
background: #CB266B;
|
||||
top: 0px;
|
||||
left: 950px;
|
||||
}
|
||||
/*新闻动态*/
|
||||
.info-container-list {
|
||||
background: #fff;
|
||||
padding: 10px 0 40px;
|
||||
}
|
||||
.info-listItem-title {
|
||||
font-size: 24px;
|
||||
margin-bottom: 26px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.info-more {
|
||||
width: 100px;
|
||||
height: 36px;
|
||||
display: block;
|
||||
line-height: 36px;
|
||||
border: 1px solid #E4E4E4;
|
||||
text-align: center;
|
||||
transition: all .1s;
|
||||
border-radius: 4px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.info-more:hover {
|
||||
background: #54a1f7;
|
||||
border-color: #54a1f7;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.info-listItem-list {
|
||||
margin-bottom: 17px;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-listItem-list dt {
|
||||
height: 180px;
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-listItem-list dt a img {
|
||||
width: 340px;
|
||||
height: 180px;
|
||||
transition: all .4s;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-listItem-list dd {
|
||||
margin-bottom: 10px;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
color: #909499;
|
||||
height: 66px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
.info-listItem-list dt a:hover img {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.cooperator .item{
|
||||
padding: 20px 0;
|
||||
}
|
||||
.cooperator .pic{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.pic a{
|
||||
display: block;
|
||||
height: 60px;
|
||||
line-height: 50px;
|
||||
border: 1px solid #CCCCCC;
|
||||
padding: 5px 10px;
|
||||
border-radius: 4px;
|
||||
color: #333333;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
|
||||
.news-tab-item.active {
|
||||
border: 1px solid #ddd;
|
||||
background: none
|
||||
}
|
||||
|
||||
.news-tab-item:hover {
|
||||
color: #fff;
|
||||
background: #07c;
|
||||
border-color: #07c;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.news-item-time {
|
||||
float: left;
|
||||
width: 65px;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.news-item-day {
|
||||
position: relative;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
padding-top: 5px;
|
||||
display: block
|
||||
}
|
||||
|
||||
.news-item-day:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -6px;
|
||||
margin-left: -8px;
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
background: #ddd
|
||||
}
|
||||
|
||||
.news-item-month {
|
||||
color: #999;
|
||||
font-size: 12px
|
||||
}
|
||||
|
||||
.news-item-text {
|
||||
padding: 10px 5px 10px 75px
|
||||
}
|
||||
.news-wrap .news-list-item{
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px solid #E6E6E6;
|
||||
}
|
||||
.news-wrap .news-list-item:hover{
|
||||
box-shadow:0px 0px 10px #ccc;
|
||||
}
|
||||
.news-wrap .news-list-item:hover .customize-unpreviewable{
|
||||
color: #54a1f7;
|
||||
}
|
||||
.news-wrap .news-list-item:last-of-type{
|
||||
border: none;
|
||||
}
|
||||
.news-item-title {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
overflow: hidden;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal
|
||||
}
|
||||
|
||||
.news-item-title:hover {
|
||||
text-decoration: none;
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
|
||||
.news-item-content {
|
||||
color: #666;
|
||||
line-height: 20px;
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical
|
||||
}
|
||||
.news .carousel-inner>.item>a>img,.news .carousel-inner>.item>img,.news .img-responsive,.news .thumbnail a>img,.news .thumbnail>img{
|
||||
height: 440px;
|
||||
}
|
||||
.cooperator{
|
||||
padding: 10px 0 20px;
|
||||
}
|
||||
.cooperator .pic a img{
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
margin-right: 5px;
|
||||
float: left;
|
||||
}
|
||||
.copyright{
|
||||
background: #303848;
|
||||
color: #CCCCCC;
|
||||
padding: 30px 0 20px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
.copyright ul li{
|
||||
font-size: 14px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.copyright ul li a{
|
||||
font-size: 14px;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
.copyright ul li a:hover{
|
||||
color:#54a1f7 ;
|
||||
}
|
||||
.copyright ul li.first{
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.bottomOne{
|
||||
clear: both;
|
||||
border-top: 1px solid #666;
|
||||
padding-top: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
.copyright img{
|
||||
width: 120px;
|
||||
float: right;
|
||||
}
|
||||
.tuji{
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
.news{
|
||||
height: 640px;
|
||||
margin: 30px 0;
|
||||
background:#e5f0fa;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.carousel2{
|
||||
padding: 10px;
|
||||
background: #FFFFFF;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.xuanchuan{
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
background: url(../img/bottom.jpg) no-repeat center;
|
||||
background-size:100% ;
|
||||
margin: 30px 0 10px;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
padding-top: 40px;
|
||||
}
|
||||
.xuanchuan h5{
|
||||
font-size: 34px;
|
||||
font-weight: bold;
|
||||
font-family: "宋体";
|
||||
}
|
After Width: | Height: | Size: 141 KiB |
After Width: | Height: | Size: 516 KiB |
After Width: | Height: | Size: 175 KiB |
After Width: | Height: | Size: 234 KiB |
After Width: | Height: | Size: 115 KiB |
After Width: | Height: | Size: 156 KiB |
After Width: | Height: | Size: 516 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 143 KiB |
After Width: | Height: | Size: 93 KiB |
After Width: | Height: | Size: 122 KiB |
After Width: | Height: | Size: 332 KiB |
After Width: | Height: | Size: 1.0 MiB |
After Width: | Height: | Size: 103 KiB |
After Width: | Height: | Size: 922 KiB |
After Width: | Height: | Size: 163 KiB |
After Width: | Height: | Size: 842 B |
After Width: | Height: | Size: 951 B |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 53 KiB |
After Width: | Height: | Size: 48 KiB |
After Width: | Height: | Size: 85 KiB |
After Width: | Height: | Size: 7.1 KiB |
After Width: | Height: | Size: 757 B |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 265 KiB |
|
@ -0,0 +1,121 @@
|
|||
/*柱状*/
|
||||
var myChart = echarts.init(document.getElementById('zhuzhuang'));
|
||||
var dataAxis = ['领养', '击', '柱', '子', '或', '者', '两', '指', '在', '触', '屏', '上', '滑', '动', '能', '够', '自', '动', '缩', '放'];
|
||||
var data = [220, 182, 191, 234, 290, 330, 310, 123, 442, 321, 90, 149, 210, 122, 133, 334, 198, 123, 125, 220];
|
||||
var yMax = 500;
|
||||
var dataShadow = [];
|
||||
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
dataShadow.push(yMax);
|
||||
}
|
||||
|
||||
option = {
|
||||
title : {
|
||||
text: '同名数量统计',
|
||||
x:'center'
|
||||
},
|
||||
xAxis:{
|
||||
type: 'category',
|
||||
data: ['其他', '物种1', '物种2', '物种3', '物种4','物种5','物种6','物种7','物种8','物种9','物种10']
|
||||
},
|
||||
yAxis: {
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#999'
|
||||
}
|
||||
}
|
||||
},
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{ // For shadow
|
||||
type: 'bar',
|
||||
itemStyle: {
|
||||
normal: {color: 'rgba(0,0,0,0.05)'}
|
||||
},
|
||||
barGap:'-100%',
|
||||
barCategoryGap:'40%',
|
||||
data: dataShadow,
|
||||
animation: false
|
||||
},
|
||||
{
|
||||
type: 'bar',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0, 0, 0, 1,
|
||||
[
|
||||
{offset: 0, color: '#83bff6'},
|
||||
{offset: 0.5, color: '#188df0'},
|
||||
{offset: 1, color: '#188df0'}
|
||||
]
|
||||
)
|
||||
},
|
||||
emphasis: {
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0, 0, 0, 1,
|
||||
[
|
||||
{offset: 0, color: '#2378f7'},
|
||||
{offset: 0.7, color: '#2378f7'},
|
||||
{offset: 1, color: '#83bff6'}
|
||||
]
|
||||
)
|
||||
}
|
||||
},
|
||||
data: data
|
||||
}
|
||||
]
|
||||
};
|
||||
myChart.setOption(option);
|
||||
/*饼图*/
|
||||
var myChart1 = echarts.init(document.getElementById('bingtu'));
|
||||
option1 = {
|
||||
title : {
|
||||
text: '某站点用户访问来源',
|
||||
subtext: '纯属虚构',
|
||||
x:'center'
|
||||
},
|
||||
tooltip : {
|
||||
trigger: 'item',
|
||||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||||
},
|
||||
color:['#a3ccf8','#5156b8','#69d4db','#f88d48','#515fd7'],
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
left: 'left',
|
||||
data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
|
||||
},
|
||||
series : [
|
||||
{
|
||||
name: '访问来源',
|
||||
type: 'pie',
|
||||
radius : '55%',
|
||||
center: ['50%', '60%'],
|
||||
data:[
|
||||
{value:335, name:'直接访问'},
|
||||
{value:310, name:'邮件营销'},
|
||||
{value:234, name:'联盟广告'},
|
||||
{value:135, name:'视频广告'},
|
||||
{value:1548, name:'搜索引擎'}
|
||||
],
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
myChart1.setOption(option1);
|
|
@ -0,0 +1 @@
|
|||
.ol-box{box-sizing:border-box;border-radius:2px;border:2px solid #00f}.ol-mouse-position{top:8px;right:8px;position:absolute}.ol-scale-line{background:rgba(0,60,136,.3);border-radius:4px;bottom:8px;left:8px;padding:2px;position:absolute}.ol-scale-line-inner{border:1px solid #eee;border-top:none;color:#eee;font-size:10px;text-align:center;margin:1px;will-change:contents,width}.ol-overlay-container{will-change:left,right,top,bottom}.ol-unsupported{display:none}.ol-unselectable,.ol-viewport{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ol-selectable{-webkit-touch-callout:default;-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.ol-grabbing{cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing}.ol-grab{cursor:move;cursor:-webkit-grab;cursor:-moz-grab;cursor:grab}.ol-control{position:absolute;background-color:rgba(255,255,255,.4);border-radius:4px;padding:2px}.ol-control:hover{background-color:rgba(255,255,255,.6)}.ol-zoom{top:.5em;left:.5em}.ol-rotate{top:.5em;right:.5em;transition:opacity .25s linear,visibility 0s linear}.ol-rotate.ol-hidden{opacity:0;visibility:hidden;transition:opacity .25s linear,visibility 0s linear .25s}.ol-zoom-extent{top:4.643em;left:.5em}.ol-full-screen{right:.5em;top:.5em}@media print{.ol-control{display:none}}.ol-control button{display:block;margin:1px;padding:0;color:#fff;font-size:1.14em;font-weight:700;text-decoration:none;text-align:center;height:1.375em;width:1.375em;line-height:.4em;background-color:rgba(0,60,136,.5);border:none;border-radius:2px}.ol-control button::-moz-focus-inner{border:none;padding:0}.ol-zoom-extent button{line-height:1.4em}.ol-compass{display:block;font-weight:400;font-size:1.2em;will-change:transform}.ol-touch .ol-control button{font-size:1.5em}.ol-touch .ol-zoom-extent{top:5.5em}.ol-control button:focus,.ol-control button:hover{text-decoration:none;background-color:rgba(0,60,136,.7)}.ol-zoom .ol-zoom-in{border-radius:2px 2px 0 0}.ol-zoom .ol-zoom-out{border-radius:0 0 2px 2px}.ol-attribution{text-align:right;bottom:.5em;right:.5em;max-width:calc(100% - 1.3em)}.ol-attribution ul{margin:0;padding:0 .5em;font-size:.7rem;line-height:1.375em;color:#000;text-shadow:0 0 2px #fff}.ol-attribution li{display:inline;list-style:none;line-height:inherit}.ol-attribution li:not(:last-child):after{content:" "}.ol-attribution img{max-height:2em;max-width:inherit;vertical-align:middle}.ol-attribution button,.ol-attribution ul{display:inline-block}.ol-attribution.ol-collapsed ul{display:none}.ol-attribution.ol-logo-only ul{display:block}.ol-attribution:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-attribution.ol-uncollapsible{bottom:0;right:0;border-radius:4px 0 0;height:1.1em;line-height:1em}.ol-attribution.ol-logo-only{background:0 0;bottom:.4em;height:1.1em;line-height:1em}.ol-attribution.ol-uncollapsible img{margin-top:-.2em;max-height:1.6em}.ol-attribution.ol-logo-only button,.ol-attribution.ol-uncollapsible button{display:none}.ol-zoomslider{top:4.5em;left:.5em;height:200px}.ol-zoomslider button{position:relative;height:10px}.ol-touch .ol-zoomslider{top:5.5em}.ol-overviewmap{left:.5em;bottom:.5em}.ol-overviewmap.ol-uncollapsible{bottom:0;left:0;border-radius:0 4px 0 0}.ol-overviewmap .ol-overviewmap-map,.ol-overviewmap button{display:inline-block}.ol-overviewmap .ol-overviewmap-map{border:1px solid #7b98bc;height:150px;margin:2px;width:150px}.ol-overviewmap:not(.ol-collapsed) button{bottom:1px;left:2px;position:absolute}.ol-overviewmap.ol-collapsed .ol-overviewmap-map,.ol-overviewmap.ol-uncollapsible button{display:none}.ol-overviewmap:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-overviewmap-box{border:2px dotted rgba(0,60,136,.7)}.ol-overviewmap .ol-overviewmap-box:hover{cursor:move}
|
|
@ -0,0 +1,482 @@
|
|||
/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
|
||||
/*
|
||||
|
||||
Contents:
|
||||
|
||||
1. Buttons
|
||||
2. Share modal and links
|
||||
3. Index indicator ("1 of X" counter)
|
||||
4. Caption
|
||||
5. Loading indicator
|
||||
6. Additional styles (root element, top bar, idle state, hidden state, etc.)
|
||||
|
||||
*/
|
||||
/*
|
||||
|
||||
1. Buttons
|
||||
|
||||
*/
|
||||
/* <button> css reset */
|
||||
.pswp__button {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
position: relative;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
overflow: visible;
|
||||
-webkit-appearance: none;
|
||||
display: block;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
float: right;
|
||||
opacity: 0.75;
|
||||
-webkit-transition: opacity 0.2s;
|
||||
transition: opacity 0.2s;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none; }
|
||||
.pswp__button:focus, .pswp__button:hover {
|
||||
opacity: 1; }
|
||||
.pswp__button:active {
|
||||
outline: none;
|
||||
opacity: 0.9; }
|
||||
.pswp__button::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border: 0; }
|
||||
|
||||
/* pswp__ui--over-close class it added when mouse is over element that should close gallery */
|
||||
.pswp__ui--over-close .pswp__button--close {
|
||||
opacity: 1; }
|
||||
|
||||
.pswp__button,
|
||||
.pswp__button--arrow--left:before,
|
||||
.pswp__button--arrow--right:before {
|
||||
background: url(default-skin.png) 0 0 no-repeat;
|
||||
background-size: 264px 88px;
|
||||
width: 44px;
|
||||
height: 44px; }
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 1.1), (-webkit-min-device-pixel-ratio: 1.09375), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
|
||||
/* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
|
||||
.pswp--svg .pswp__button,
|
||||
.pswp--svg .pswp__button--arrow--left:before,
|
||||
.pswp--svg .pswp__button--arrow--right:before {
|
||||
background-image: url(default-skin.svg); }
|
||||
.pswp--svg .pswp__button--arrow--left,
|
||||
.pswp--svg .pswp__button--arrow--right {
|
||||
background: none; } }
|
||||
|
||||
.pswp__button--close {
|
||||
background-position: 0 -44px; }
|
||||
|
||||
.pswp__button--share {
|
||||
background-position: -44px -44px; }
|
||||
|
||||
.pswp__button--fs {
|
||||
display: none; }
|
||||
|
||||
.pswp--supports-fs .pswp__button--fs {
|
||||
display: block; }
|
||||
|
||||
.pswp--fs .pswp__button--fs {
|
||||
background-position: -44px 0; }
|
||||
|
||||
.pswp__button--zoom {
|
||||
display: none;
|
||||
background-position: -88px 0; }
|
||||
|
||||
.pswp--zoom-allowed .pswp__button--zoom {
|
||||
display: block; }
|
||||
|
||||
.pswp--zoomed-in .pswp__button--zoom {
|
||||
background-position: -132px 0; }
|
||||
|
||||
/* no arrows on touch screens */
|
||||
.pswp--touch .pswp__button--arrow--left,
|
||||
.pswp--touch .pswp__button--arrow--right {
|
||||
visibility: hidden; }
|
||||
|
||||
/*
|
||||
Arrow buttons hit area
|
||||
(icon is added to :before pseudo-element)
|
||||
*/
|
||||
.pswp__button--arrow--left,
|
||||
.pswp__button--arrow--right {
|
||||
background: none;
|
||||
top: 50%;
|
||||
margin-top: -50px;
|
||||
width: 70px;
|
||||
height: 100px;
|
||||
position: absolute; }
|
||||
|
||||
.pswp__button--arrow--left {
|
||||
left: 0; }
|
||||
|
||||
.pswp__button--arrow--right {
|
||||
right: 0; }
|
||||
|
||||
.pswp__button--arrow--left:before,
|
||||
.pswp__button--arrow--right:before {
|
||||
content: '';
|
||||
top: 35px;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
height: 30px;
|
||||
width: 32px;
|
||||
position: absolute; }
|
||||
|
||||
.pswp__button--arrow--left:before {
|
||||
left: 6px;
|
||||
background-position: -138px -44px; }
|
||||
|
||||
.pswp__button--arrow--right:before {
|
||||
right: 6px;
|
||||
background-position: -94px -44px; }
|
||||
|
||||
/*
|
||||
|
||||
2. Share modal/popup and links
|
||||
|
||||
*/
|
||||
.pswp__counter,
|
||||
.pswp__share-modal {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none; }
|
||||
|
||||
.pswp__share-modal {
|
||||
display: block;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 10px;
|
||||
position: absolute;
|
||||
z-index: 1600;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.25s ease-out;
|
||||
transition: opacity 0.25s ease-out;
|
||||
-webkit-backface-visibility: hidden;
|
||||
will-change: opacity; }
|
||||
|
||||
.pswp__share-modal--hidden {
|
||||
display: none; }
|
||||
|
||||
.pswp__share-tooltip {
|
||||
z-index: 1620;
|
||||
position: absolute;
|
||||
background: #FFF;
|
||||
top: 56px;
|
||||
border-radius: 2px;
|
||||
display: block;
|
||||
width: auto;
|
||||
right: 44px;
|
||||
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
|
||||
-webkit-transform: translateY(6px);
|
||||
-ms-transform: translateY(6px);
|
||||
transform: translateY(6px);
|
||||
-webkit-transition: -webkit-transform 0.25s;
|
||||
transition: transform 0.25s;
|
||||
-webkit-backface-visibility: hidden;
|
||||
will-change: transform; }
|
||||
.pswp__share-tooltip a {
|
||||
display: block;
|
||||
padding: 8px 12px;
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
line-height: 18px; }
|
||||
.pswp__share-tooltip a:hover {
|
||||
text-decoration: none;
|
||||
color: #000; }
|
||||
.pswp__share-tooltip a:first-child {
|
||||
/* round corners on the first/last list item */
|
||||
border-radius: 2px 2px 0 0; }
|
||||
.pswp__share-tooltip a:last-child {
|
||||
border-radius: 0 0 2px 2px; }
|
||||
|
||||
.pswp__share-modal--fade-in {
|
||||
opacity: 1; }
|
||||
.pswp__share-modal--fade-in .pswp__share-tooltip {
|
||||
-webkit-transform: translateY(0);
|
||||
-ms-transform: translateY(0);
|
||||
transform: translateY(0); }
|
||||
|
||||
/* increase size of share links on touch devices */
|
||||
.pswp--touch .pswp__share-tooltip a {
|
||||
padding: 16px 12px; }
|
||||
|
||||
a.pswp__share--facebook:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
top: -12px;
|
||||
right: 15px;
|
||||
border: 6px solid transparent;
|
||||
border-bottom-color: #FFF;
|
||||
-webkit-pointer-events: none;
|
||||
-moz-pointer-events: none;
|
||||
pointer-events: none; }
|
||||
|
||||
a.pswp__share--facebook:hover {
|
||||
background: #3E5C9A;
|
||||
color: #FFF; }
|
||||
a.pswp__share--facebook:hover:before {
|
||||
border-bottom-color: #3E5C9A; }
|
||||
|
||||
a.pswp__share--twitter:hover {
|
||||
background: #55ACEE;
|
||||
color: #FFF; }
|
||||
|
||||
a.pswp__share--pinterest:hover {
|
||||
background: #CCC;
|
||||
color: #CE272D; }
|
||||
|
||||
a.pswp__share--download:hover {
|
||||
background: #DDD; }
|
||||
|
||||
/*
|
||||
|
||||
3. Index indicator ("1 of X" counter)
|
||||
|
||||
*/
|
||||
.pswp__counter {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 44px;
|
||||
font-size: 13px;
|
||||
line-height: 44px;
|
||||
color: #FFF;
|
||||
opacity: 0.75;
|
||||
padding: 0 10px; }
|
||||
|
||||
/*
|
||||
|
||||
4. Caption
|
||||
|
||||
*/
|
||||
.pswp__caption {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
min-height: 44px; }
|
||||
.pswp__caption small {
|
||||
font-size: 11px;
|
||||
color: #BBB; }
|
||||
|
||||
.pswp__caption__center {
|
||||
text-align: left;
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
font-size: 13px;
|
||||
padding: 10px;
|
||||
line-height: 20px;
|
||||
color: #CCC; }
|
||||
|
||||
.pswp__caption--empty {
|
||||
display: none; }
|
||||
|
||||
/* Fake caption element, used to calculate height of next/prev image */
|
||||
.pswp__caption--fake {
|
||||
visibility: hidden; }
|
||||
|
||||
/*
|
||||
|
||||
5. Loading indicator (preloader)
|
||||
|
||||
You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR
|
||||
|
||||
*/
|
||||
.pswp__preloader {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
margin-left: -22px;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.25s ease-out;
|
||||
transition: opacity 0.25s ease-out;
|
||||
will-change: opacity;
|
||||
direction: ltr; }
|
||||
|
||||
.pswp__preloader__icn {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 12px; }
|
||||
|
||||
.pswp__preloader--active {
|
||||
opacity: 1; }
|
||||
.pswp__preloader--active .pswp__preloader__icn {
|
||||
/* We use .gif in browsers that don't support CSS animation */
|
||||
background: url(preloader.gif) 0 0 no-repeat; }
|
||||
|
||||
.pswp--css_animation .pswp__preloader--active {
|
||||
opacity: 1; }
|
||||
.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
|
||||
-webkit-animation: clockwise 500ms linear infinite;
|
||||
animation: clockwise 500ms linear infinite; }
|
||||
.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
|
||||
-webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
|
||||
animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; }
|
||||
|
||||
.pswp--css_animation .pswp__preloader__icn {
|
||||
background: none;
|
||||
opacity: 0.75;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
top: 15px;
|
||||
margin: 0; }
|
||||
|
||||
.pswp--css_animation .pswp__preloader__cut {
|
||||
/*
|
||||
The idea of animating inner circle is based on Polymer ("material") loading indicator
|
||||
by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
|
||||
*/
|
||||
position: relative;
|
||||
width: 7px;
|
||||
height: 14px;
|
||||
overflow: hidden; }
|
||||
|
||||
.pswp--css_animation .pswp__preloader__donut {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 2px solid #FFF;
|
||||
border-radius: 50%;
|
||||
border-left-color: transparent;
|
||||
border-bottom-color: transparent;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: none;
|
||||
margin: 0; }
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.pswp__preloader {
|
||||
position: relative;
|
||||
left: auto;
|
||||
top: auto;
|
||||
margin: 0;
|
||||
float: right; } }
|
||||
|
||||
@-webkit-keyframes clockwise {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg); } }
|
||||
|
||||
@keyframes clockwise {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg); } }
|
||||
|
||||
@-webkit-keyframes donut-rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0); }
|
||||
50% {
|
||||
-webkit-transform: rotate(-140deg);
|
||||
transform: rotate(-140deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0); } }
|
||||
|
||||
@keyframes donut-rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0); }
|
||||
50% {
|
||||
-webkit-transform: rotate(-140deg);
|
||||
transform: rotate(-140deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0); } }
|
||||
|
||||
/*
|
||||
|
||||
6. Additional styles
|
||||
|
||||
*/
|
||||
/* root element of UI */
|
||||
.pswp__ui {
|
||||
-webkit-font-smoothing: auto;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
z-index: 1550; }
|
||||
|
||||
/* top black bar with buttons and "1 of X" indicator */
|
||||
.pswp__top-bar {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 44px;
|
||||
width: 100%; }
|
||||
|
||||
.pswp__caption,
|
||||
.pswp__top-bar,
|
||||
.pswp--has_mouse .pswp__button--arrow--left,
|
||||
.pswp--has_mouse .pswp__button--arrow--right {
|
||||
-webkit-backface-visibility: hidden;
|
||||
will-change: opacity;
|
||||
-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
|
||||
transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
|
||||
|
||||
/* pswp--has_mouse class is added only when two subsequent mousemove events occur */
|
||||
.pswp--has_mouse .pswp__button--arrow--left,
|
||||
.pswp--has_mouse .pswp__button--arrow--right {
|
||||
visibility: visible; }
|
||||
|
||||
.pswp__top-bar,
|
||||
.pswp__caption {
|
||||
background-color: rgba(0, 0, 0, 0.5); }
|
||||
|
||||
/* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
|
||||
.pswp__ui--fit .pswp__top-bar,
|
||||
.pswp__ui--fit .pswp__caption {
|
||||
background-color: rgba(0, 0, 0, 0.3); }
|
||||
|
||||
/* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
|
||||
.pswp__ui--idle .pswp__top-bar {
|
||||
opacity: 0; }
|
||||
|
||||
.pswp__ui--idle .pswp__button--arrow--left,
|
||||
.pswp__ui--idle .pswp__button--arrow--right {
|
||||
opacity: 0; }
|
||||
|
||||
/*
|
||||
pswp__ui--hidden class is added when controls are hidden
|
||||
e.g. when user taps to toggle visibility of controls
|
||||
*/
|
||||
.pswp__ui--hidden .pswp__top-bar,
|
||||
.pswp__ui--hidden .pswp__caption,
|
||||
.pswp__ui--hidden .pswp__button--arrow--left,
|
||||
.pswp__ui--hidden .pswp__button--arrow--right {
|
||||
/* Force paint & create composition layer for controls. */
|
||||
opacity: 0.001; }
|
||||
|
||||
/* pswp__ui--one-slide class is added when there is just one item in gallery */
|
||||
.pswp__ui--one-slide .pswp__button--arrow--left,
|
||||
.pswp__ui--one-slide .pswp__button--arrow--right,
|
||||
.pswp__ui--one-slide .pswp__counter {
|
||||
display: none; }
|
||||
|
||||
.pswp__element--disabled {
|
||||
display: none !important; }
|
||||
|
||||
.pswp--minimal--dark .pswp__top-bar {
|
||||
background: none; }
|
After Width: | Height: | Size: 547 B |
|
@ -0,0 +1 @@
|
|||
<svg width="264" height="88" viewBox="0 0 264 88" xmlns="http://www.w3.org/2000/svg"><title>default-skin 2</title><g fill="none" fill-rule="evenodd"><g><path d="M67.002 59.5v3.768c-6.307.84-9.184 5.75-10.002 9.732 2.22-2.83 5.564-5.098 10.002-5.098V71.5L73 65.585 67.002 59.5z" id="Shape" fill="#fff"/><g fill="#fff"><path d="M13 29v-5h2v3h3v2h-5zM13 15h5v2h-3v3h-2v-5zM31 15v5h-2v-3h-3v-2h5zM31 29h-5v-2h3v-3h2v5z" id="Shape"/></g><g fill="#fff"><path d="M62 24v5h-2v-3h-3v-2h5zM62 20h-5v-2h3v-3h2v5zM70 20v-5h2v3h3v2h-5zM70 24h5v2h-3v3h-2v-5z"/></g><path d="M20.586 66l-5.656-5.656 1.414-1.414L22 64.586l5.656-5.656 1.414 1.414L23.414 66l5.656 5.656-1.414 1.414L22 67.414l-5.656 5.656-1.414-1.414L20.586 66z" fill="#fff"/><path d="M111.785 65.03L110 63.5l3-3.5h-10v-2h10l-3-3.5 1.785-1.468L117 59l-5.215 6.03z" fill="#fff"/><path d="M152.215 65.03L154 63.5l-3-3.5h10v-2h-10l3-3.5-1.785-1.468L147 59l5.215 6.03z" fill="#fff"/><g><path id="Rectangle-11" fill="#fff" d="M160.957 28.543l-3.25-3.25-1.413 1.414 3.25 3.25z"/><path d="M152.5 27c3.038 0 5.5-2.462 5.5-5.5s-2.462-5.5-5.5-5.5-5.5 2.462-5.5 5.5 2.462 5.5 5.5 5.5z" id="Oval-1" stroke="#fff" stroke-width="1.5"/><path fill="#fff" d="M150 21h5v1h-5z"/></g><g><path d="M116.957 28.543l-1.414 1.414-3.25-3.25 1.414-1.414 3.25 3.25z" fill="#fff"/><path d="M108.5 27c3.038 0 5.5-2.462 5.5-5.5s-2.462-5.5-5.5-5.5-5.5 2.462-5.5 5.5 2.462 5.5 5.5 5.5z" stroke="#fff" stroke-width="1.5"/><path fill="#fff" d="M106 21h5v1h-5z"/><path fill="#fff" d="M109.043 19.008l-.085 5-1-.017.085-5z"/></g></g></g></svg>
|
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 866 B |
|
@ -0,0 +1,861 @@
|
|||
/*! PhotoSwipe Default UI - 4.1.2 - 2017-04-05
|
||||
* http://photoswipe.com
|
||||
* Copyright (c) 2017 Dmitry Semenov; */
|
||||
/**
|
||||
*
|
||||
* UI on top of main sliding area (caption, arrows, close button, etc.).
|
||||
* Built just using public methods/properties of PhotoSwipe.
|
||||
*
|
||||
*/
|
||||
(function (root, factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
module.exports = factory();
|
||||
} else {
|
||||
root.PhotoSwipeUI_Default = factory();
|
||||
}
|
||||
})(this, function () {
|
||||
|
||||
'use strict';
|
||||
|
||||
|
||||
|
||||
var PhotoSwipeUI_Default =
|
||||
function(pswp, framework) {
|
||||
|
||||
var ui = this;
|
||||
var _overlayUIUpdated = false,
|
||||
_controlsVisible = true,
|
||||
_fullscrenAPI,
|
||||
_controls,
|
||||
_captionContainer,
|
||||
_fakeCaptionContainer,
|
||||
_indexIndicator,
|
||||
_shareButton,
|
||||
_shareModal,
|
||||
_shareModalHidden = true,
|
||||
_initalCloseOnScrollValue,
|
||||
_isIdle,
|
||||
_listen,
|
||||
|
||||
_loadingIndicator,
|
||||
_loadingIndicatorHidden,
|
||||
_loadingIndicatorTimeout,
|
||||
|
||||
_galleryHasOneSlide,
|
||||
|
||||
_options,
|
||||
_defaultUIOptions = {
|
||||
barsSize: {top:44, bottom:'auto'},
|
||||
closeElClasses: ['item', 'caption', 'zoom-wrap', 'ui', 'top-bar'],
|
||||
timeToIdle: 4000,
|
||||
timeToIdleOutside: 1000,
|
||||
loadingIndicatorDelay: 1000, // 2s
|
||||
|
||||
addCaptionHTMLFn: function(item, captionEl /*, isFake */) {
|
||||
if(!item.title) {
|
||||
captionEl.children[0].innerHTML = '';
|
||||
return false;
|
||||
}
|
||||
captionEl.children[0].innerHTML = item.title;
|
||||
return true;
|
||||
},
|
||||
|
||||
closeEl:true,
|
||||
captionEl: true,
|
||||
fullscreenEl: true,
|
||||
zoomEl: true,
|
||||
shareEl: true,
|
||||
counterEl: true,
|
||||
arrowEl: true,
|
||||
preloaderEl: true,
|
||||
|
||||
tapToClose: false,
|
||||
tapToToggleControls: true,
|
||||
|
||||
clickToCloseNonZoomable: true,
|
||||
|
||||
shareButtons: [
|
||||
{id:'facebook', label:'Share on Facebook', url:'https://www.facebook.com/sharer/sharer.php?u={{url}}'},
|
||||
{id:'twitter', label:'Tweet', url:'https://twitter.com/intent/tweet?text={{text}}&url={{url}}'},
|
||||
{id:'pinterest', label:'Pin it', url:'http://www.pinterest.com/pin/create/button/'+
|
||||
'?url={{url}}&media={{image_url}}&description={{text}}'},
|
||||
{id:'download', label:'Download image', url:'{{raw_image_url}}', download:true}
|
||||
],
|
||||
getImageURLForShare: function( /* shareButtonData */ ) {
|
||||
return pswp.currItem.src || '';
|
||||
},
|
||||
getPageURLForShare: function( /* shareButtonData */ ) {
|
||||
return window.location.href;
|
||||
},
|
||||
getTextForShare: function( /* shareButtonData */ ) {
|
||||
return pswp.currItem.title || '';
|
||||
},
|
||||
|
||||
indexIndicatorSep: ' / ',
|
||||
fitControlsWidth: 1200
|
||||
|
||||
},
|
||||
_blockControlsTap,
|
||||
_blockControlsTapTimeout;
|
||||
|
||||
|
||||
|
||||
var _onControlsTap = function(e) {
|
||||
if(_blockControlsTap) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
||||
e = e || window.event;
|
||||
|
||||
if(_options.timeToIdle && _options.mouseUsed && !_isIdle) {
|
||||
// reset idle timer
|
||||
_onIdleMouseMove();
|
||||
}
|
||||
|
||||
|
||||
var target = e.target || e.srcElement,
|
||||
uiElement,
|
||||
clickedClass = target.getAttribute('class') || '',
|
||||
found;
|
||||
|
||||
for(var i = 0; i < _uiElements.length; i++) {
|
||||
uiElement = _uiElements[i];
|
||||
if(uiElement.onTap && clickedClass.indexOf('pswp__' + uiElement.name ) > -1 ) {
|
||||
uiElement.onTap();
|
||||
found = true;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if(found) {
|
||||
if(e.stopPropagation) {
|
||||
e.stopPropagation();
|
||||
}
|
||||
_blockControlsTap = true;
|
||||
|
||||
// Some versions of Android don't prevent ghost click event
|
||||
// when preventDefault() was called on touchstart and/or touchend.
|
||||
//
|
||||
// This happens on v4.3, 4.2, 4.1,
|
||||
// older versions strangely work correctly,
|
||||
// but just in case we add delay on all of them)
|
||||
var tapDelay = framework.features.isOldAndroid ? 600 : 30;
|
||||
_blockControlsTapTimeout = setTimeout(function() {
|
||||
_blockControlsTap = false;
|
||||
}, tapDelay);
|
||||
}
|
||||
|
||||
},
|
||||
_fitControlsInViewport = function() {
|
||||
return !pswp.likelyTouchDevice || _options.mouseUsed || screen.width > _options.fitControlsWidth;
|
||||
},
|
||||
_togglePswpClass = function(el, cName, add) {
|
||||
framework[ (add ? 'add' : 'remove') + 'Class' ](el, 'pswp__' + cName);
|
||||
},
|
||||
|
||||
// add class when there is just one item in the gallery
|
||||
// (by default it hides left/right arrows and 1ofX counter)
|
||||
_countNumItems = function() {
|
||||
var hasOneSlide = (_options.getNumItemsFn() === 1);
|
||||
|
||||
if(hasOneSlide !== _galleryHasOneSlide) {
|
||||
_togglePswpClass(_controls, 'ui--one-slide', hasOneSlide);
|
||||
_galleryHasOneSlide = hasOneSlide;
|
||||
}
|
||||
},
|
||||
_toggleShareModalClass = function() {
|
||||
_togglePswpClass(_shareModal, 'share-modal--hidden', _shareModalHidden);
|
||||
},
|
||||
_toggleShareModal = function() {
|
||||
|
||||
_shareModalHidden = !_shareModalHidden;
|
||||
|
||||
|
||||
if(!_shareModalHidden) {
|
||||
_toggleShareModalClass();
|
||||
setTimeout(function() {
|
||||
if(!_shareModalHidden) {
|
||||
framework.addClass(_shareModal, 'pswp__share-modal--fade-in');
|
||||
}
|
||||
}, 30);
|
||||
} else {
|
||||
framework.removeClass(_shareModal, 'pswp__share-modal--fade-in');
|
||||
setTimeout(function() {
|
||||
if(_shareModalHidden) {
|
||||
_toggleShareModalClass();
|
||||
}
|
||||
}, 300);
|
||||
}
|
||||
|
||||
if(!_shareModalHidden) {
|
||||
_updateShareURLs();
|
||||
}
|
||||
return false;
|
||||
},
|
||||
|
||||
_openWindowPopup = function(e) {
|
||||
e = e || window.event;
|
||||
var target = e.target || e.srcElement;
|
||||
|
||||
pswp.shout('shareLinkClick', e, target);
|
||||
|
||||
if(!target.href) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if( target.hasAttribute('download') ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
window.open(target.href, 'pswp_share', 'scrollbars=yes,resizable=yes,toolbar=no,'+
|
||||
'location=yes,width=550,height=420,top=100,left=' +
|
||||
(window.screen ? Math.round(screen.width / 2 - 275) : 100) );
|
||||
|
||||
if(!_shareModalHidden) {
|
||||
_toggleShareModal();
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
_updateShareURLs = function() {
|
||||
var shareButtonOut = '',
|
||||
shareButtonData,
|
||||
shareURL,
|
||||
image_url,
|
||||
page_url,
|
||||
share_text;
|
||||
|
||||
for(var i = 0; i < _options.shareButtons.length; i++) {
|
||||
shareButtonData = _options.shareButtons[i];
|
||||
|
||||
image_url = _options.getImageURLForShare(shareButtonData);
|
||||
page_url = _options.getPageURLForShare(shareButtonData);
|
||||
share_text = _options.getTextForShare(shareButtonData);
|
||||
|
||||
shareURL = shareButtonData.url.replace('{{url}}', encodeURIComponent(page_url) )
|
||||
.replace('{{image_url}}', encodeURIComponent(image_url) )
|
||||
.replace('{{raw_image_url}}', image_url )
|
||||
.replace('{{text}}', encodeURIComponent(share_text) );
|
||||
|
||||
shareButtonOut += '<a href="' + shareURL + '" target="_blank" '+
|
||||
'class="pswp__share--' + shareButtonData.id + '"' +
|
||||
(shareButtonData.download ? 'download' : '') + '>' +
|
||||
shareButtonData.label + '</a>';
|
||||
|
||||
if(_options.parseShareButtonOut) {
|
||||
shareButtonOut = _options.parseShareButtonOut(shareButtonData, shareButtonOut);
|
||||
}
|
||||
}
|
||||
_shareModal.children[0].innerHTML = shareButtonOut;
|
||||
_shareModal.children[0].onclick = _openWindowPopup;
|
||||
|
||||
},
|
||||
_hasCloseClass = function(target) {
|
||||
for(var i = 0; i < _options.closeElClasses.length; i++) {
|
||||
if( framework.hasClass(target, 'pswp__' + _options.closeElClasses[i]) ) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
},
|
||||
_idleInterval,
|
||||
_idleTimer,
|
||||
_idleIncrement = 0,
|
||||
_onIdleMouseMove = function() {
|
||||
clearTimeout(_idleTimer);
|
||||
_idleIncrement = 0;
|
||||
if(_isIdle) {
|
||||
ui.setIdle(false);
|
||||
}
|
||||
},
|
||||
_onMouseLeaveWindow = function(e) {
|
||||
e = e ? e : window.event;
|
||||
var from = e.relatedTarget || e.toElement;
|
||||
if (!from || from.nodeName === 'HTML') {
|
||||
clearTimeout(_idleTimer);
|
||||
_idleTimer = setTimeout(function() {
|
||||
ui.setIdle(true);
|
||||
}, _options.timeToIdleOutside);
|
||||
}
|
||||
},
|
||||
_setupFullscreenAPI = function() {
|
||||
if(_options.fullscreenEl && !framework.features.isOldAndroid) {
|
||||
if(!_fullscrenAPI) {
|
||||
_fullscrenAPI = ui.getFullscreenAPI();
|
||||
}
|
||||
if(_fullscrenAPI) {
|
||||
framework.bind(document, _fullscrenAPI.eventK, ui.updateFullscreen);
|
||||
ui.updateFullscreen();
|
||||
framework.addClass(pswp.template, 'pswp--supports-fs');
|
||||
} else {
|
||||
framework.removeClass(pswp.template, 'pswp--supports-fs');
|
||||
}
|
||||
}
|
||||
},
|
||||
_setupLoadingIndicator = function() {
|
||||
// Setup loading indicator
|
||||
if(_options.preloaderEl) {
|
||||
|
||||
_toggleLoadingIndicator(true);
|
||||
|
||||
_listen('beforeChange', function() {
|
||||
|
||||
clearTimeout(_loadingIndicatorTimeout);
|
||||
|
||||
// display loading indicator with delay
|
||||
_loadingIndicatorTimeout = setTimeout(function() {
|
||||
|
||||
if(pswp.currItem && pswp.currItem.loading) {
|
||||
|
||||
if( !pswp.allowProgressiveImg() || (pswp.currItem.img && !pswp.currItem.img.naturalWidth) ) {
|
||||
// show preloader if progressive loading is not enabled,
|
||||
// or image width is not defined yet (because of slow connection)
|
||||
_toggleLoadingIndicator(false);
|
||||
// items-controller.js function allowProgressiveImg
|
||||
}
|
||||
|
||||
} else {
|
||||
_toggleLoadingIndicator(true); // hide preloader
|
||||
}
|
||||
|
||||
}, _options.loadingIndicatorDelay);
|
||||
|
||||
});
|
||||
_listen('imageLoadComplete', function(index, item) {
|
||||
if(pswp.currItem === item) {
|
||||
_toggleLoadingIndicator(true);
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
_toggleLoadingIndicator = function(hide) {
|
||||
if( _loadingIndicatorHidden !== hide ) {
|
||||
_togglePswpClass(_loadingIndicator, 'preloader--active', !hide);
|
||||
_loadingIndicatorHidden = hide;
|
||||
}
|
||||
},
|
||||
_applyNavBarGaps = function(item) {
|
||||
var gap = item.vGap;
|
||||
|
||||
if( _fitControlsInViewport() ) {
|
||||
|
||||
var bars = _options.barsSize;
|
||||
if(_options.captionEl && bars.bottom === 'auto') {
|
||||
if(!_fakeCaptionContainer) {
|
||||
_fakeCaptionContainer = framework.createEl('pswp__caption pswp__caption--fake');
|
||||
_fakeCaptionContainer.appendChild( framework.createEl('pswp__caption__center') );
|
||||
_controls.insertBefore(_fakeCaptionContainer, _captionContainer);
|
||||
framework.addClass(_controls, 'pswp__ui--fit');
|
||||
}
|
||||
if( _options.addCaptionHTMLFn(item, _fakeCaptionContainer, true) ) {
|
||||
|
||||
var captionSize = _fakeCaptionContainer.clientHeight;
|
||||
gap.bottom = parseInt(captionSize,10) || 44;
|
||||
} else {
|
||||
gap.bottom = bars.top; // if no caption, set size of bottom gap to size of top
|
||||
}
|
||||
} else {
|
||||
gap.bottom = bars.bottom === 'auto' ? 0 : bars.bottom;
|
||||
}
|
||||
|
||||
// height of top bar is static, no need to calculate it
|
||||
gap.top = bars.top;
|
||||
} else {
|
||||
gap.top = gap.bottom = 0;
|
||||
}
|
||||
},
|
||||
_setupIdle = function() {
|
||||
// Hide controls when mouse is used
|
||||
if(_options.timeToIdle) {
|
||||
_listen('mouseUsed', function() {
|
||||
|
||||
framework.bind(document, 'mousemove', _onIdleMouseMove);
|
||||
framework.bind(document, 'mouseout', _onMouseLeaveWindow);
|
||||
|
||||
_idleInterval = setInterval(function() {
|
||||
_idleIncrement++;
|
||||
if(_idleIncrement === 2) {
|
||||
ui.setIdle(true);
|
||||
}
|
||||
}, _options.timeToIdle / 2);
|
||||
});
|
||||
}
|
||||
},
|
||||
_setupHidingControlsDuringGestures = function() {
|
||||
|
||||
// Hide controls on vertical drag
|
||||
_listen('onVerticalDrag', function(now) {
|
||||
if(_controlsVisible && now < 0.95) {
|
||||
ui.hideControls();
|
||||
} else if(!_controlsVisible && now >= 0.95) {
|
||||
ui.showControls();
|
||||
}
|
||||
});
|
||||
|
||||
// Hide controls when pinching to close
|
||||
var pinchControlsHidden;
|
||||
_listen('onPinchClose' , function(now) {
|
||||
if(_controlsVisible && now < 0.9) {
|
||||
ui.hideControls();
|
||||
pinchControlsHidden = true;
|
||||
} else if(pinchControlsHidden && !_controlsVisible && now > 0.9) {
|
||||
ui.showControls();
|
||||
}
|
||||
});
|
||||
|
||||
_listen('zoomGestureEnded', function() {
|
||||
pinchControlsHidden = false;
|
||||
if(pinchControlsHidden && !_controlsVisible) {
|
||||
ui.showControls();
|
||||
}
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
||||
var _uiElements = [
|
||||
{
|
||||
name: 'caption',
|
||||
option: 'captionEl',
|
||||
onInit: function(el) {
|
||||
_captionContainer = el;
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'share-modal',
|
||||
option: 'shareEl',
|
||||
onInit: function(el) {
|
||||
_shareModal = el;
|
||||
},
|
||||
onTap: function() {
|
||||
_toggleShareModal();
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'button--share',
|
||||
option: 'shareEl',
|
||||
onInit: function(el) {
|
||||
_shareButton = el;
|
||||
},
|
||||
onTap: function() {
|
||||
_toggleShareModal();
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'button--zoom',
|
||||
option: 'zoomEl',
|
||||
onTap: pswp.toggleDesktopZoom
|
||||
},
|
||||
{
|
||||
name: 'counter',
|
||||
option: 'counterEl',
|
||||
onInit: function(el) {
|
||||
_indexIndicator = el;
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'button--close',
|
||||
option: 'closeEl',
|
||||
onTap: pswp.close
|
||||
},
|
||||
{
|
||||
name: 'button--arrow--left',
|
||||
option: 'arrowEl',
|
||||
onTap: pswp.prev
|
||||
},
|
||||
{
|
||||
name: 'button--arrow--right',
|
||||
option: 'arrowEl',
|
||||
onTap: pswp.next
|
||||
},
|
||||
{
|
||||
name: 'button--fs',
|
||||
option: 'fullscreenEl',
|
||||
onTap: function() {
|
||||
if(_fullscrenAPI.isFullscreen()) {
|
||||
_fullscrenAPI.exit();
|
||||
} else {
|
||||
_fullscrenAPI.enter();
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'preloader',
|
||||
option: 'preloaderEl',
|
||||
onInit: function(el) {
|
||||
_loadingIndicator = el;
|
||||
}
|
||||
}
|
||||
|
||||
];
|
||||
|
||||
var _setupUIElements = function() {
|
||||
var item,
|
||||
classAttr,
|
||||
uiElement;
|
||||
|
||||
var loopThroughChildElements = function(sChildren) {
|
||||
if(!sChildren) {
|
||||
return;
|
||||
}
|
||||
|
||||
var l = sChildren.length;
|
||||
for(var i = 0; i < l; i++) {
|
||||
item = sChildren[i];
|
||||
classAttr = item.className;
|
||||
|
||||
for(var a = 0; a < _uiElements.length; a++) {
|
||||
uiElement = _uiElements[a];
|
||||
|
||||
if(classAttr.indexOf('pswp__' + uiElement.name) > -1 ) {
|
||||
|
||||
if( _options[uiElement.option] ) { // if element is not disabled from options
|
||||
|
||||
framework.removeClass(item, 'pswp__element--disabled');
|
||||
if(uiElement.onInit) {
|
||||
uiElement.onInit(item);
|
||||
}
|
||||
|
||||
//item.style.display = 'block';
|
||||
} else {
|
||||
framework.addClass(item, 'pswp__element--disabled');
|
||||
//item.style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
loopThroughChildElements(_controls.children);
|
||||
|
||||
var topBar = framework.getChildByClass(_controls, 'pswp__top-bar');
|
||||
if(topBar) {
|
||||
loopThroughChildElements( topBar.children );
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
ui.init = function() {
|
||||
|
||||
// extend options
|
||||
framework.extend(pswp.options, _defaultUIOptions, true);
|
||||
|
||||
// create local link for fast access
|
||||
_options = pswp.options;
|
||||
|
||||
// find pswp__ui element
|
||||
_controls = framework.getChildByClass(pswp.scrollWrap, 'pswp__ui');
|
||||
|
||||
// create local link
|
||||
_listen = pswp.listen;
|
||||
|
||||
|
||||
_setupHidingControlsDuringGestures();
|
||||
|
||||
// update controls when slides change
|
||||
_listen('beforeChange', ui.update);
|
||||
|
||||
// toggle zoom on double-tap
|
||||
_listen('doubleTap', function(point) {
|
||||
var initialZoomLevel = pswp.currItem.initialZoomLevel;
|
||||
if(pswp.getZoomLevel() !== initialZoomLevel) {
|
||||
pswp.zoomTo(initialZoomLevel, point, 333);
|
||||
} else {
|
||||
pswp.zoomTo(_options.getDoubleTapZoom(false, pswp.currItem), point, 333);
|
||||
}
|
||||
});
|
||||
|
||||
// Allow text selection in caption
|
||||
_listen('preventDragEvent', function(e, isDown, preventObj) {
|
||||
var t = e.target || e.srcElement;
|
||||
if(
|
||||
t &&
|
||||
t.getAttribute('class') && e.type.indexOf('mouse') > -1 &&
|
||||
( t.getAttribute('class').indexOf('__caption') > 0 || (/(SMALL|STRONG|EM)/i).test(t.tagName) )
|
||||
) {
|
||||
preventObj.prevent = false;
|
||||
}
|
||||
});
|
||||
|
||||
// bind events for UI
|
||||
_listen('bindEvents', function() {
|
||||
framework.bind(_controls, 'pswpTap click', _onControlsTap);
|
||||
framework.bind(pswp.scrollWrap, 'pswpTap', ui.onGlobalTap);
|
||||
|
||||
if(!pswp.likelyTouchDevice) {
|
||||
framework.bind(pswp.scrollWrap, 'mouseover', ui.onMouseOver);
|
||||
}
|
||||
});
|
||||
|
||||
// unbind events for UI
|
||||
_listen('unbindEvents', function() {
|
||||
if(!_shareModalHidden) {
|
||||
_toggleShareModal();
|
||||
}
|
||||
|
||||
if(_idleInterval) {
|
||||
clearInterval(_idleInterval);
|
||||
}
|
||||
framework.unbind(document, 'mouseout', _onMouseLeaveWindow);
|
||||
framework.unbind(document, 'mousemove', _onIdleMouseMove);
|
||||
framework.unbind(_controls, 'pswpTap click', _onControlsTap);
|
||||
framework.unbind(pswp.scrollWrap, 'pswpTap', ui.onGlobalTap);
|
||||
framework.unbind(pswp.scrollWrap, 'mouseover', ui.onMouseOver);
|
||||
|
||||
if(_fullscrenAPI) {
|
||||
framework.unbind(document, _fullscrenAPI.eventK, ui.updateFullscreen);
|
||||
if(_fullscrenAPI.isFullscreen()) {
|
||||
_options.hideAnimationDuration = 0;
|
||||
_fullscrenAPI.exit();
|
||||
}
|
||||
_fullscrenAPI = null;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// clean up things when gallery is destroyed
|
||||
_listen('destroy', function() {
|
||||
if(_options.captionEl) {
|
||||
if(_fakeCaptionContainer) {
|
||||
_controls.removeChild(_fakeCaptionContainer);
|
||||
}
|
||||
framework.removeClass(_captionContainer, 'pswp__caption--empty');
|
||||
}
|
||||
|
||||
if(_shareModal) {
|
||||
_shareModal.children[0].onclick = null;
|
||||
}
|
||||
framework.removeClass(_controls, 'pswp__ui--over-close');
|
||||
framework.addClass( _controls, 'pswp__ui--hidden');
|
||||
ui.setIdle(false);
|
||||
});
|
||||
|
||||
|
||||
if(!_options.showAnimationDuration) {
|
||||
framework.removeClass( _controls, 'pswp__ui--hidden');
|
||||
}
|
||||
_listen('initialZoomIn', function() {
|
||||
if(_options.showAnimationDuration) {
|
||||
framework.removeClass( _controls, 'pswp__ui--hidden');
|
||||
}
|
||||
});
|
||||
_listen('initialZoomOut', function() {
|
||||
framework.addClass( _controls, 'pswp__ui--hidden');
|
||||
});
|
||||
|
||||
_listen('parseVerticalMargin', _applyNavBarGaps);
|
||||
|
||||
_setupUIElements();
|
||||
|
||||
if(_options.shareEl && _shareButton && _shareModal) {
|
||||
_shareModalHidden = true;
|
||||
}
|
||||
|
||||
_countNumItems();
|
||||
|
||||
_setupIdle();
|
||||
|
||||
_setupFullscreenAPI();
|
||||
|
||||
_setupLoadingIndicator();
|
||||
};
|
||||
|
||||
ui.setIdle = function(isIdle) {
|
||||
_isIdle = isIdle;
|
||||
_togglePswpClass(_controls, 'ui--idle', isIdle);
|
||||
};
|
||||
|
||||
ui.update = function() {
|
||||
// Don't update UI if it's hidden
|
||||
if(_controlsVisible && pswp.currItem) {
|
||||
|
||||
ui.updateIndexIndicator();
|
||||
|
||||
if(_options.captionEl) {
|
||||
_options.addCaptionHTMLFn(pswp.currItem, _captionContainer);
|
||||
|
||||
_togglePswpClass(_captionContainer, 'caption--empty', !pswp.currItem.title);
|
||||
}
|
||||
|
||||
_overlayUIUpdated = true;
|
||||
|
||||
} else {
|
||||
_overlayUIUpdated = false;
|
||||
}
|
||||
|
||||
if(!_shareModalHidden) {
|
||||
_toggleShareModal();
|
||||
}
|
||||
|
||||
_countNumItems();
|
||||
};
|
||||
|
||||
ui.updateFullscreen = function(e) {
|
||||
|
||||
if(e) {
|
||||
// some browsers change window scroll position during the fullscreen
|
||||
// so PhotoSwipe updates it just in case
|
||||
setTimeout(function() {
|
||||
pswp.setScrollOffset( 0, framework.getScrollY() );
|
||||
}, 50);
|
||||
}
|
||||
|
||||
// toogle pswp--fs class on root element
|
||||
framework[ (_fullscrenAPI.isFullscreen() ? 'add' : 'remove') + 'Class' ](pswp.template, 'pswp--fs');
|
||||
};
|
||||
|
||||
ui.updateIndexIndicator = function() {
|
||||
if(_options.counterEl) {
|
||||
_indexIndicator.innerHTML = (pswp.getCurrentIndex()+1) +
|
||||
_options.indexIndicatorSep +
|
||||
_options.getNumItemsFn();
|
||||
}
|
||||
};
|
||||
|
||||
ui.onGlobalTap = function(e) {
|
||||
e = e || window.event;
|
||||
var target = e.target || e.srcElement;
|
||||
|
||||
if(_blockControlsTap) {
|
||||
return;
|
||||
}
|
||||
|
||||
if(e.detail && e.detail.pointerType === 'mouse') {
|
||||
|
||||
// close gallery if clicked outside of the image
|
||||
if(_hasCloseClass(target)) {
|
||||
pswp.close();
|
||||
return;
|
||||
}
|
||||
|
||||
if(framework.hasClass(target, 'pswp__img')) {
|
||||
if(pswp.getZoomLevel() === 1 && pswp.getZoomLevel() <= pswp.currItem.fitRatio) {
|
||||
if(_options.clickToCloseNonZoomable) {
|
||||
pswp.close();
|
||||
}
|
||||
} else {
|
||||
pswp.toggleDesktopZoom(e.detail.releasePoint);
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
// tap anywhere (except buttons) to toggle visibility of controls
|
||||
if(_options.tapToToggleControls) {
|
||||
if(_controlsVisible) {
|
||||
ui.hideControls();
|
||||
} else {
|
||||
ui.showControls();
|
||||
}
|
||||
}
|
||||
|
||||
// tap to close gallery
|
||||
if(_options.tapToClose && (framework.hasClass(target, 'pswp__img') || _hasCloseClass(target)) ) {
|
||||
pswp.close();
|
||||
return;
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
ui.onMouseOver = function(e) {
|
||||
e = e || window.event;
|
||||
var target = e.target || e.srcElement;
|
||||
|
||||
// add class when mouse is over an element that should close the gallery
|
||||
_togglePswpClass(_controls, 'ui--over-close', _hasCloseClass(target));
|
||||
};
|
||||
|
||||
ui.hideControls = function() {
|
||||
framework.addClass(_controls,'pswp__ui--hidden');
|
||||
_controlsVisible = false;
|
||||
};
|
||||
|
||||
ui.showControls = function() {
|
||||
_controlsVisible = true;
|
||||
if(!_overlayUIUpdated) {
|
||||
ui.update();
|
||||
}
|
||||
framework.removeClass(_controls,'pswp__ui--hidden');
|
||||
};
|
||||
|
||||
ui.supportsFullscreen = function() {
|
||||
var d = document;
|
||||
return !!(d.exitFullscreen || d.mozCancelFullScreen || d.webkitExitFullscreen || d.msExitFullscreen);
|
||||
};
|
||||
|
||||
ui.getFullscreenAPI = function() {
|
||||
var dE = document.documentElement,
|
||||
api,
|
||||
tF = 'fullscreenchange';
|
||||
|
||||
if (dE.requestFullscreen) {
|
||||
api = {
|
||||
enterK: 'requestFullscreen',
|
||||
exitK: 'exitFullscreen',
|
||||
elementK: 'fullscreenElement',
|
||||
eventK: tF
|
||||
};
|
||||
|
||||
} else if(dE.mozRequestFullScreen ) {
|
||||
api = {
|
||||
enterK: 'mozRequestFullScreen',
|
||||
exitK: 'mozCancelFullScreen',
|
||||
elementK: 'mozFullScreenElement',
|
||||
eventK: 'moz' + tF
|
||||
};
|
||||
|
||||
|
||||
|
||||
} else if(dE.webkitRequestFullscreen) {
|
||||
api = {
|
||||
enterK: 'webkitRequestFullscreen',
|
||||
exitK: 'webkitExitFullscreen',
|
||||
elementK: 'webkitFullscreenElement',
|
||||
eventK: 'webkit' + tF
|
||||
};
|
||||
|
||||
} else if(dE.msRequestFullscreen) {
|
||||
api = {
|
||||
enterK: 'msRequestFullscreen',
|
||||
exitK: 'msExitFullscreen',
|
||||
elementK: 'msFullscreenElement',
|
||||
eventK: 'MSFullscreenChange'
|
||||
};
|
||||
}
|
||||
|
||||
if(api) {
|
||||
api.enter = function() {
|
||||
// disable close-on-scroll in fullscreen
|
||||
_initalCloseOnScrollValue = _options.closeOnScroll;
|
||||
_options.closeOnScroll = false;
|
||||
|
||||
if(this.enterK === 'webkitRequestFullscreen') {
|
||||
pswp.template[this.enterK]( Element.ALLOW_KEYBOARD_INPUT );
|
||||
} else {
|
||||
return pswp.template[this.enterK]();
|
||||
}
|
||||
};
|
||||
api.exit = function() {
|
||||
_options.closeOnScroll = _initalCloseOnScrollValue;
|
||||
|
||||
return document[this.exitK]();
|
||||
|
||||
};
|
||||
api.isFullscreen = function() { return document[this.elementK]; };
|
||||
}
|
||||
|
||||
return api;
|
||||
};
|
||||
|
||||
|
||||
|
||||
};
|
||||
return PhotoSwipeUI_Default;
|
||||
|
||||
|
||||
});
|
|
@ -0,0 +1,179 @@
|
|||
/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
|
||||
/*
|
||||
Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
|
||||
*/
|
||||
/* pswp = photoswipe */
|
||||
.pswp {
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
overflow: hidden;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
z-index: 1500;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
/* create separate layer, to avoid paint on window.onscroll in webkit/blink */
|
||||
-webkit-backface-visibility: hidden;
|
||||
outline: none; }
|
||||
.pswp * {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box; }
|
||||
.pswp img {
|
||||
max-width: none; }
|
||||
|
||||
/* style is added when JS option showHideOpacity is set to true */
|
||||
.pswp--animate_opacity {
|
||||
/* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
|
||||
opacity: 0.001;
|
||||
will-change: opacity;
|
||||
/* for open/close transition */
|
||||
-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
|
||||
transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
|
||||
|
||||
.pswp--open {
|
||||
display: block; }
|
||||
|
||||
.pswp--zoom-allowed .pswp__img {
|
||||
/* autoprefixer: off */
|
||||
cursor: -webkit-zoom-in;
|
||||
cursor: -moz-zoom-in;
|
||||
cursor: zoom-in; }
|
||||
|
||||
.pswp--zoomed-in .pswp__img {
|
||||
/* autoprefixer: off */
|
||||
cursor: -webkit-grab;
|
||||
cursor: -moz-grab;
|
||||
cursor: grab; }
|
||||
|
||||
.pswp--dragging .pswp__img {
|
||||
/* autoprefixer: off */
|
||||
cursor: -webkit-grabbing;
|
||||
cursor: -moz-grabbing;
|
||||
cursor: grabbing; }
|
||||
|
||||
/*
|
||||
Background is added as a separate element.
|
||||
As animating opacity is much faster than animating rgba() background-color.
|
||||
*/
|
||||
.pswp__bg {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #000;
|
||||
opacity: 0;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
-webkit-backface-visibility: hidden;
|
||||
will-change: opacity; }
|
||||
|
||||
.pswp__scroll-wrap {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden; }
|
||||
|
||||
.pswp__container,
|
||||
.pswp__zoom-wrap {
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0; }
|
||||
|
||||
/* Prevent selection and tap highlights */
|
||||
.pswp__container,
|
||||
.pswp__img {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
-webkit-touch-callout: none; }
|
||||
|
||||
.pswp__zoom-wrap {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
-webkit-transform-origin: left top;
|
||||
-ms-transform-origin: left top;
|
||||
transform-origin: left top;
|
||||
/* for open/close transition */
|
||||
-webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
|
||||
transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }
|
||||
|
||||
.pswp__bg {
|
||||
will-change: opacity;
|
||||
/* for open/close transition */
|
||||
-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
|
||||
transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
|
||||
|
||||
.pswp--animated-in .pswp__bg,
|
||||
.pswp--animated-in .pswp__zoom-wrap {
|
||||
-webkit-transition: none;
|
||||
transition: none; }
|
||||
|
||||
.pswp__container,
|
||||
.pswp__zoom-wrap {
|
||||
-webkit-backface-visibility: hidden; }
|
||||
|
||||
.pswp__item {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden; }
|
||||
|
||||
.pswp__img {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: auto;
|
||||
top: 0;
|
||||
left: 0; }
|
||||
|
||||
/*
|
||||
stretched thumbnail or div placeholder element (see below)
|
||||
style is added to avoid flickering in webkit/blink when layers overlap
|
||||
*/
|
||||
.pswp__img--placeholder {
|
||||
-webkit-backface-visibility: hidden; }
|
||||
|
||||
/*
|
||||
div element that matches size of large image
|
||||
large image loads on top of it
|
||||
*/
|
||||
.pswp__img--placeholder--blank {
|
||||
background: #222; }
|
||||
|
||||
.pswp--ie .pswp__img {
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
left: 0;
|
||||
top: 0; }
|
||||
|
||||
/*
|
||||
Error message appears when image is not loaded
|
||||
(JS option errorMsg controls markup)
|
||||
*/
|
||||
.pswp__error-msg {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-top: -8px;
|
||||
color: #CCC; }
|
||||
|
||||
.pswp__error-msg a {
|
||||
color: #CCC;
|
||||
text-decoration: underline; }
|