<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Home</title>
<link rel="icon" href="images/favicon.ico">
<link rel="shortcut icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/zerogrid.css" >
<link rel="stylesheet" href="css/camera.css">
<link rel="stylesheet" href="css/form.css">
<link rel="stylesheet" href="css/responsive.css">
<script src="js/jquery.js"></script>
<script src="js/jquery-migrate-1.1.1.js"></script>
<script src="js/superfish.js"></script>
<script src="js/forms.js"></script>
<script src="js/jquery.ui.totop.js"></script>
<script src="js/jquery.equalheights.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/jquery.ui.totop.js"></script>
<script src="js/tms-0.4.1.js"></script>
<script src="js/css3-mediaqueries.js"></script>
<script>
$(document).ready(function(){
$('.slider_wrapper')._TMS({
show:0,
pauseOnHover:false,
prevBu:'.prev',
nextBu:'.next',
playBu:false,
duration:800,
preset:'fade',
pagination:true,//'.pagination',true,'<ul></ul>'
pagNums:false,
slideshow:8000,
numStatus:false,
banners: 'fade',
waitBannerAnimation:false,
progressBar:false
});
});
$(document).ready(function(){
!function(){
var map=[]
,names=[]
,win=$(window)
,header=$('header')
,currClass
$('.content').each(function(n){
map[n]=this.offsetTop
names[n]=$(this).attr('id')
})
win
.on('scroll',function(){
var i=0
while(map[i++]<=win.scrollTop());
if(currClass!==names[i-2])
currClass=names[i-2]
header.removeAttr("class").addClass(names[i-2])
})
}(); });
function goToByScroll(id){
$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}
$(document).ready(function(){
$().UItoTop({ easingType: 'easeOutQuart' });
});
</script>
<!--[if lt IE 8]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="http//windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
<img src="http//storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
</a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<link rel="stylesheet" media="screen" href="css/ie.css">
<![endif]-->
</head>
<body class="">
<!--==============================header=================================-->
<header class="page1">
<div class="zerogrid">
<div class="col-full">
<div class="wrap-col">
<div class="menu_block">
<nav class="">
<ul class="sf-menu">
<li class="current men"><a onClick="goToByScroll('page1'); return false;" href="#">Home </a> <strong class="hover"></strong></li>
<li class="men1"><a onClick="goToByScroll('page2'); return false;" href="#">About</a><strong class="hover"></strong></li>
<li class=" men2"><a onClick="goToByScroll('page3'); return false;" href="#">Services</a> <strong class="hover"></strong></li>
<li class=" men3"><a onClick="goToByScroll('page4'); return false;" href="#">Clients</a> <strong class="hover"></strong></li>
<li class=" men4"><a onClick="goToByScroll('page5'); return false;" href="#">Contacts</a> <strong class="hover"></strong></li>
</ul>
</nav>
<div class="clear"></div>
</div>
<h1><a href="#" onClick="goToByScroll('page1'); return false;"><img src="images/logo.png" alt="Gerald Harris attorney at law"></a></h1>
</div>
</div>
<div class="clear"></div>
</div>
</header>
<!--=======content================================-->
<div id="page1" class="content">
<div class="zerogrid">
<div class="col-full">
<div class="wrap-col">
<div class="slider_wrapper">
<ul class="items">
<li>
<img src="images/spacer.gif" alt="">
<div class="caption banner">
<h2>Let Us Show You the Way to Success</h2>
</div>
</li>
<li>
<img src="images/spacer.gif" alt="">
<div class="caption banner">
<h2>Interminable Energy for Your Project</h2>
</div>
</li>
<li>
<img src="images/spacer.gif" alt="">
<div class="caption banner">
<h2>We know how to solve your problems!</h2>
</div>
</li>
<li>
<img src="images/spacer.gif" alt="">
<div class="caption banner">
<h2>Make your business a booming one!</h2>
</div>
</li>
</ul>
</div>
<div class="socials">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
</div>
</div>
</div>
<div id="page2" class="content">
<div class="zerogrid">
<div class="col-full">
<div class="wrap-col">
<div class="slogan">
<h3>Only Professional <a onClick="goToByScroll('page3'); return false;" href="#"><span>Services</span></a> for Our <a onClick="goToByScroll('page4'); return false;" href="#"><em>Clients</em></a></h3>
<div class="text1">
<a href="http//blog.templatemonster.com/free-website-templates/" rel="nofollow" class="tm_link"> Click here</a> for more info about this free website template created by TemplateMonster.com <br> Lorem ipsum dolor sit amet, consectetur adipiscing elit. In mollis erat mattis neque facilisis, sit amet ultricies
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<div class="box maxheight">
<img src="images/box_img1.jpg" alt="">
<div class="text1"><a href="#">Laura Stegner</a></div>senior manager
<div class="socials1">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<div class="box maxheight">
<img src="images/box_img2.jpg" alt="">
<div class="text1"><a href="#">Anton Stegner</a></div> manager
<div class="socials1">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<div class="box maxheight">
<img src="images/box_img3.jpg" alt="">
<div class="text1"><a href="#">Lisa Haddon </a></div>accounter
<div class="socials1">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<div class="box maxheight">
<img src="images/box_img4.jpg" alt="">
<div class="text1"><a href="#">Bradley Grosh</a></div>director
<div class="socials1">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="page3" class="content">
<div class="zerogrid">
<div class="col-full">
<div class="wrap-col">
<div class="slogan">
<h3>Our Services</h3>
<div class="text1">
Vivamus at magna non nunc tristique rhoncus. Aliquam nibh ante, egestas id dictum a, commodo luctus libero. Praesent faucibus malesuada faucibus. Donec lao
前端静态模板-响应式彩色大气-学生作业毕设实训素材.zip （54个子文件） 
响应式彩色大气 css 
grid.css 5KB ie.css 416B camera.css 6KB responsive.css 884B reset.css 771B zerogrid.css 2KB superfish.css 1KB form.css 2KB style.css.bak 8KB style.css 8KB touchTouch.css 2KB bat images 
logo1.jpg 4KB
pagination.png 3KB logo2.jpg 4KB logo6.jpg 4KB logo7.jpg 3KB socials.png 6KB soc1.png 5KB box_img3.jpg 12KB
camera-loader.gif 9KB logo8.jpg 2KB box1_img4.png 2KB box1_img2.png 3KB box_img1.jpg 7KB logo5.jpg 6KB box1_img3.png 3KB box1_img1.png 2KB totop.png 5KB logo.png 4KB spacer.gif 43B box_img2.jpg 7KB footer_logo.png 2KB logo4.jpg 3KB link_marker.png 1KB favicon.ico 97KB box_img4.jpg 11KB logo3.jpg 3KB logo6.png 11KB
index.html 16KB js jquery.js 90KB tms-0.4.1.js 36KB jquery.ui.totop.js 2KB html5shiv.js 2KB touchTouch.jquery.js 6KB forms.js 6KB jquery.color.js 16KB css3-mediaqueries.js 16KB jquery-migrate-1.1.1.js 7KB camera.js 68KB PIE.htc 40KB jquery.equalheights.js 1KB jquery.mobile.customized.min.js 17KB jquery.easing.1.3.js 8KB superfish.js 4KB资源评论
