You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
483 lines
20 KiB
483 lines
20 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>苏州创新投资集团有限公司</title>
|
|
<meta name="Keywords" content="">
|
|
<meta name="Description" content="">
|
|
<meta name="applicable-device"content="pc,mobile">
|
|
<link href="css/bootstrap.css" rel="stylesheet">
|
|
<link href="css/bxslider.css" rel="stylesheet">
|
|
<link href="css/style.css" rel="stylesheet">
|
|
<link href="css/swiper-bundle.min.css" rel="stylesheet">
|
|
<script src="js/jquery.min.js"></script>
|
|
<script src="js/bxslider.min.js"></script>
|
|
<script src="js/common.js"></script>
|
|
<script src="js/bootstrap.js"></script>
|
|
<style>
|
|
* {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.container-pro {
|
|
width: 100%;
|
|
height: 500%;
|
|
position: absolute;
|
|
top: 0;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
|
|
.section1 {
|
|
/* background-color: rebeccapurple;
|
|
background: url(images/首页-第四页bg.jpg);*/
|
|
|
|
}
|
|
|
|
.section2 {
|
|
background-color: skyblue;
|
|
background: url(images/首页-第二页bg.jpg) center top no-repeat;
|
|
|
|
}
|
|
|
|
.section3 {
|
|
background-color: red;
|
|
background: url(images/电子信息-bg.jpg) center top no-repeat;
|
|
|
|
}
|
|
|
|
.section4 {
|
|
background-color: orange;
|
|
background: url(images/首页-第三页bg.jpg) center top no-repeat;
|
|
|
|
}
|
|
|
|
.section5 {
|
|
background-color: lightgreen;
|
|
background: url(images/首页-第四页bg.jpg) center top no-repeat;
|
|
|
|
}
|
|
|
|
.section6 {
|
|
background-color: #fff;
|
|
/*background: url(images/首页-第四页bg.jpg);*/
|
|
|
|
}
|
|
|
|
.section {
|
|
width: 100%;
|
|
height: 20%;
|
|
display: flex;
|
|
color: white;
|
|
/*justify-content: center;*/
|
|
align-items: center;
|
|
background-size: cover;
|
|
}
|
|
|
|
|
|
.controls {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 20px;
|
|
transform: translateY(-50%);
|
|
list-style: none;
|
|
}
|
|
|
|
.controls li {
|
|
width: 50px;
|
|
height: 50px;
|
|
font: bold 22px/50px '宋体';
|
|
text-align: center;
|
|
background-color: #000;
|
|
color: white;
|
|
cursor: pointer;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.controls li+li {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.controls li.active {
|
|
background-color: #fff;
|
|
color: red;
|
|
}
|
|
|
|
/*add*/
|
|
.swiper-slide img{ width: 100%;height: 100%; }
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container-pro">
|
|
<div class="section section1">
|
|
|
|
<!-- p1 -->
|
|
<header>
|
|
|
|
<div class="top_logo">
|
|
<div class="logo_wrap"> <a href="/"><img src="images/logo2.png" class="logo" alt=""/></a> </div>
|
|
</div>
|
|
|
|
<!-- Fixed navbar -->
|
|
|
|
<nav id="top_nav" class="navbar navbar-default navbar-static-top">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">导航菜单</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
|
|
<span id="small_search" class="glyphicon glyphicon-search" aria-hidden="true"></span> <a class="navbar-brand" href="#">导航菜单</a> </div>
|
|
<div id="navbar" class="navbar-collapse collapse">
|
|
<ul class="nav navbar-nav">
|
|
<li><a href="#">首页</a></li>
|
|
<li class="dropdown"><a href="about/about01.html">关于我们</a> </li>
|
|
<li class="dropdown"> <a href="service/service01.html">业务版图</a> </li>
|
|
<li class="dropdown"> <a href="news/news01.html">新闻中心</a> </li>
|
|
<li class="dropdown"> <a href="work/work.html">党建工作</a> </li>
|
|
<li class="dropdown"> <a href="talent/talent01.html">人才发展</a> </li>
|
|
<li class="dropdown"> <a href="form/form.html">投资申请</a> </li>
|
|
</ul>
|
|
</div>
|
|
<!--/.nav-collapse -->
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
<!-- Swiper -->
|
|
<div class="swiper mySwiper">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner1.jpg" alt="">
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner2.jpg" alt="">
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner3.jpg" alt="">
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner4.jpg" alt="">
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner5.jpg" alt="">
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="images/首页-banner6.jpg" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="section section2">
|
|
|
|
<!-- 数字展示 -->
|
|
<div class="number_box" style="width: 100%!important;">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-xs-12 col-sm-12 col-md-12 number_text" data-move-y="140px">
|
|
<p>苏创投立足苏州市创新型城市发展战略，以数字经济时代下产业创新集群的建设为使命，以全周期科技投资业务为支柱，发挥国有金融资本的引领带动作用，织精织密全市创新资本网络，推动产业链和创新链深度融合。</p>
|
|
</div>
|
|
|
|
<div class="col-sm-4 col-md-4 counter-wrap">
|
|
<div class="counter"><span>180</span> 亿元</div>
|
|
<p class="text">注册资本</p>
|
|
</div>
|
|
<div class="col-sm-4 col-md-4 counter-wrap">
|
|
<div class="counter"><span>237</span> 亿元</div>
|
|
<p class="text">总资产</p>
|
|
</div>
|
|
<div class="col-sm-4 col-md-4 counter-wrap">
|
|
<div class="counter"><span>1400</span> 亿元</div>
|
|
<p class="text">管理规模</p>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
<a href="#" class="about_more">探索更多</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="section section3">
|
|
|
|
<!-- 电子信息 交互 -->
|
|
<div class="elec_box" style="width: 100%!important;">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-xs-12 col-sm-12 col-md-12 number_text" >
|
|
<p class="line_1">电子信息</p>
|
|
<p class="line_2">Electronic information</p>
|
|
<p class="line_3">重点关注计算机与智能消费设备制造、信息通信、新型显示、集成电路、电子元器件与专用材料产业、人工智能等领域</p>
|
|
</div>
|
|
|
|
<div class="container elec_wrap">
|
|
<div class="col-sm-4 col-md-3 elec_list">
|
|
<div class=""><img src="images/电子信息.png"></div>
|
|
<p class="text">电子信息</p>
|
|
<a href="#" class="more_white">探索更多</a>
|
|
</div>
|
|
<div class="col-sm-4 col-md-3 elec_list">
|
|
<div class=""><img src="images/装备制造.png"></div>
|
|
<p class="text">装备制造</p>
|
|
<a href="#" class="more_white">探索更多</a>
|
|
</div>
|
|
<div class="col-sm-4 col-md-3 elec_list">
|
|
<div class=""><img src="images/生物医药.png"></div>
|
|
<p class="text">医药生物</p>
|
|
<a href="#" class="more_white">探索更多</a>
|
|
</div>
|
|
<div class="col-sm-4 col-md-3 elec_list">
|
|
<div class=""><img src="images/先进材料.png"></div>
|
|
<p class="text">先进材料</p>
|
|
<a href="#" class="more_white">探索更多</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="section section4">
|
|
|
|
<!-- 新闻动态 -->
|
|
<div class="news_box" style="width: 100%!important;">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<!-- left -->
|
|
<div class="col-xs-12 col-sm-4 col-md-2 news_left">
|
|
<div class="news_left_wrap">
|
|
<h2 class="left_h2">最新动态</h2>
|
|
<p>NEWS<br>INFORMATION</p>
|
|
<button>探索更多</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-8 col-md-12 news_wrap">
|
|
<div class="list_box">
|
|
<h2 class="left_h2 news_title">集团要闻 企业动态 媒体聚焦</h2>
|
|
|
|
<div class="col-sm-4 col-md-4 col-mm-6 news_list">
|
|
<a href="/"> <img src="images/首页-第四页bg.jpg" class="img-thumbnail" alt=""/> </a>
|
|
<p class="line_1"><a href="news/detail.html" title="">世界杯第11日！</a></p>
|
|
<p class="line_2">2022卡塔尔世界杯，迎来了第11个比赛日，在C组的比赛中，阿根廷队以2-0击败了波兰队，拿到了小组第一名出线</p>
|
|
<p class="line_3">2022-12-01</p>
|
|
</div>
|
|
|
|
<div class="col-sm-4 col-md-4 col-mm-6 news_list">
|
|
<a href="/"> <img src="images/首页-第四页bg.jpg" class="img-thumbnail" alt=""/> </a>
|
|
<p class="line_1"><a href="news/detail.html" title="">世界杯第11日！</a></p>
|
|
<p class="line_2">2022卡塔尔世界杯，迎来了第11个比赛日，在C组的比赛中，阿根廷队以2-0击败了波兰队，拿到了小组第一名出线</p>
|
|
<p class="line_3">2022-12-01</p>
|
|
</div>
|
|
|
|
<div class="col-sm-4 col-md-4 col-mm-6 news_list">
|
|
<a href="/"> <img src="images/首页-第四页bg.jpg" class="img-thumbnail" alt=""/> </a>
|
|
<p class="line_1"><a href="news/detail.html" title="">世界杯第11日！</a></p>
|
|
<p class="line_2">2022卡塔尔世界杯，迎来了第11个比赛日，在C组的比赛中，阿根廷队以2-0击败了波兰队，拿到了小组第一名出线</p>
|
|
<p class="line_3">2022-12-01</p>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="section section5">
|
|
|
|
<!-- 上市企业 -->
|
|
<div class="enterprise_box" style="width: 100%!important;">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<!-- left -->
|
|
<div class="col-xs-12 col-sm-4 col-md-2 enterprise_left">
|
|
<div class="enterprise_left_wrap">
|
|
<h2 class="left_h2">上市企业</h2>
|
|
<p>LISTED<br>ENTERPRISES</p>
|
|
<button>探索更多</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-8 col-md-12 enterprise_wrap">
|
|
<div class="list_box">
|
|
<img src="images/logo.png">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="section section6">
|
|
|
|
<!-- 底部目录 -->
|
|
<div class="cate_box" style="width: 100%!important;height: 400px;">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="container wrap">
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">关于我们</div>
|
|
<ul>
|
|
<li><a href="about/about01.html" target="_blank">集团介绍</a></li>
|
|
<li><a href="about/about02.html" target="_blank">董事长致辞</a></li>
|
|
<li><a href="about/about03.html" target="_blank">核心能力</a></li>
|
|
<li><a href="about/about04.html" target="_blank">企业文化</a></li>
|
|
<li><a href="about/about05.html" target="_blank">组织构架</a></li>
|
|
<li><a href="about/about06.html" target="_blank">合作伙伴</a></li>
|
|
<li><a href="about/about07.html" target="_blank">联系我们</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">业务版图</div>
|
|
<ul>
|
|
<li><a href="service/service01.html" target="_blank">基金集群</a></li>
|
|
<li><a href="service/service11.html" target="_blank">产业地图</a></li>
|
|
<li><a href="service/service03.html" target="_blank">投贷联动</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">新闻中心</div>
|
|
<ul>
|
|
<li><a href="news/news01.html" target="_blank">集团要闻</a></li>
|
|
<li><a href="news/news02.html" target="_blank">行业动态</a></li>
|
|
<li><a href="news/news03.html" target="_blank">媒体聚焦</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">党建中心</div>
|
|
<ul>
|
|
<li><a href="work/work.html" target="_blank">党建工作</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">人才发展</div>
|
|
<ul>
|
|
<li><a href="talent/talent01.html" target="_blank">人才理念</a></li>
|
|
<li><a href="talent/talent02.html" target="_blank">人才招聘</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sm-4 col-md-2 list">
|
|
<div class="title">投资申请</div>
|
|
<ul>
|
|
<li><a href="form/form.html" target="_blank">投资申请</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container" style="margin-top: 80px;">
|
|
<div class="row">
|
|
<div class="col-md-3" style="background:red">af</div>
|
|
<div class="col-md-3" style="background:yellow">af</div>
|
|
<div class="col-md-3" style="background:red">af</div>
|
|
<div class="col-md-3" style="background:green">af</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<ul class="controls">
|
|
<li class="active">1</li>
|
|
<li>2</li>
|
|
<li>3</li>
|
|
<li>4</li>
|
|
<li>5</li>
|
|
<li>6</li>
|
|
</ul>
|
|
|
|
<script type="text/javascript" src="js/swiper-bundle.min.js"></script>
|
|
<!-- Initialize Swiper -->
|
|
<script>
|
|
var swiper = new Swiper(".mySwiper", {
|
|
pagination: {
|
|
el: ".swiper-pagination",
|
|
dynamicBullets: true,
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<script>
|
|
//实现滚动效果
|
|
const container = document.querySelector('.container-pro')
|
|
const lis = document.querySelectorAll('.controls li')
|
|
var viewHeight = null //声明页面高度
|
|
|
|
var index = 0; //当前索引
|
|
var flag = true; //节流开关
|
|
document.addEventListener('mousewheel', function (e) {
|
|
e = e || window.event
|
|
console.log(e);
|
|
// 获取整屏的高度
|
|
viewHeight = document.body.clientHeight;
|
|
if (flag) { //节流阀
|
|
flag = false
|
|
if (e.wheelDelta > 0) {
|
|
index--
|
|
if (index < 0) {
|
|
index = 0
|
|
}
|
|
} else {
|
|
index++;
|
|
if (index > lis.length - 1) {
|
|
index = lis.length - 1
|
|
}
|
|
}
|
|
container.style.top = -index * viewHeight + 'px'
|
|
changeColor(index)
|
|
setTimeout(function () {
|
|
flag = true
|
|
}, 500)
|
|
}
|
|
|
|
})
|
|
|
|
//绑定点击事件
|
|
for (let i = 0; i < lis.length; i++) {
|
|
lis[i].onclick = function () {
|
|
viewHeight = document.body.clientHeight
|
|
index = i
|
|
changeColor(index)
|
|
container.style.top = -index * viewHeight + 'px'
|
|
}
|
|
}
|
|
//改变小li颜色
|
|
function changeColor(index) {
|
|
for (var j = 0; j < lis.length; j++) {
|
|
lis[j].className = ''
|
|
}
|
|
lis[index].className = 'active'
|
|
}
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
</html> |