<!DOCTYPE HTML>
<html>
<head>
<title>Home</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Kronos Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href='http://fonts.useso.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900' rel='stylesheet' type='text/css'>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/scripts.js" type="text/javascript"></script>
<!---- start-smoth-scrolling---->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
});
});
</script>
<!---End-smoth-scrolling---->
<!------ Light Box ------>
<link rel="stylesheet" href="css/swipebox.css">
<script src="js/jquery.swipebox.min.js"></script>
<script type="text/javascript">
jQuery(function($) {
$(".swipebox").swipebox();
});
</script>
<!------ Eng Light Box ------>
<!-- Script for gallery Here -->
<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
<script type="text/javascript">
$(function () {
var filterList = {
init: function () {
// MixItUp plugin
// http://mixitup.io
$('#portfoliolist').mixitup({
targetSelector: '.portfolio',
filterSelector: '.filter',
effects: ['fade'],
easing: 'snap',
// call the hover effect
onMixEnd: filterList.hoverEffect()
});
},
hoverEffect: function () {
// Simple parallax effect
$('#portfoliolist .portfolio').hover(
function () {
$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');
},
function () {
$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');
}
);
}
};
// Run the show!
filterList.init();
});
</script>
<!-- Gallery Script Ends -->
</head>
<body>
<div class="header-banner" id="head">
<div class="container">
<div class="logo">
<a href="#"><img src="images/logo.png"></a>
</div>
<h1>HELLO, WE ARE KRONOS</h1>
<p>We are here to help you. So, what you need?</p>
<div class="arrow">
<a href="#service" class="scroll"><img src="images/top-arrow.png"></a>
</div>
</div>
</div>
<div class="header-bottom">
<div class="fixed-header">
<div class="container">
<div class="top-menu">
<span class="menu"> </span>
<ul>
<nav class="cl-effect-5">
<li><a class="scroll" href="#home"><span data-hover="Home">home</span></a></li>
<li><a class="scroll" href="#service"><span data-hover="service">service</span></a></li>
<li><a class="scroll" href="#team"><span data-hover="team">team</span></a></li>
<li><a class="scroll" href="#portfolio"><span data-hover="portfolio">portfolio</span></a></li>
<li><a class="scroll" href="#blog"><span data-hover="blog">blog</span></a></li>
<li><a class="scroll" href="#clients"><span data-hover="clients">clients</span></a></li>
<li><a class="scroll" href="#facts"><span data-hover="facts">facts</span></a></li>
<li><a class="scroll" href="#depoiments"><span data-hover="depoiments">depoiments</span></a></li>
</nav>
</ul>
<!-- script for menu -->
<!--script-nav-->
<script>
$("span.menu").click(function(){
$(".top-menu ul").slideToggle("slow" , function(){
});
});
</script>
<!-- //script for menu -->
<!-- script-for sticky-nav -->
<script>
$(document).ready(function() {
var navoffeset=$(".header-bottom").offset().top;
$(window).scroll(function(){
var scrollpos=$(window).scrollTop();
if(scrollpos >=navoffeset){
$(".header-bottom").addClass("fixed");
}else{
$(".header-bottom").removeClass("fixed");
}
});
});
</script>
<!-- //script-for sticky-nav -->
</div>
</div>
</div>
</div>
<div class="content">
<div class="service-section" id="service">
<div class="container">
<div class="service-header">
<h3>our services</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div class="service-grids">
<div class="col-md-4 service-grid">
<img src="images/icon1.jpg">
<h4>THE BEST DESIGN</h4>
<span> </span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</p>
</div>
<div class="col-md-4 service-grid">
<img src="images/icon2.jpg">
<h4>THE BEST SUPPORT</h4>
<span> </span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</p>
</div>
<div class="col-md-4 service-grid">
<img src="images/icon3.jpg">
<h4>THE BEST SOLUTIONS</h4>
<span> </span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<div class="team-section" id="team">
<div class="container">
<div class="team-header">
<h3> meet our team</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
<div class="profile">
<div class="container">
<div class="recommand-section">
<div class="recommand-section-grids">
<div class="standards">
<ul class="selectors_wrapper">
<li class="selector active" data-selector="1">Mike Foster</li>
<li class="selector" data-selector="2">Anabelle Braz</li>
<li class="selector" data-selector="3">Anthony Diaz</li>
<li class="selector" data-selector="4">Marian Sezaro</li>
<li class="selector" data-selector="5">Erick Paul</li>
<li class="selector" data-selector="6">Brian Seemann</li>
</ul>
<div class="standard_content">
<div class="standard active" data-selector="1">
<img src="images/pic1.jpg" class="img-responsive" alt="" />
</div>
<div class="skills-info">
<div id="canvas">
<div class="row skill-grids text-center">
<div class="top-grid">
<div class="grid-1">
<div class="skill-grid">
<div class="circle" id="circles-1"> </div>
<h5 class="web"><p>Photography</p></h5>
</div
html5pc静态模板 紫色大屏创意设计模板 （含响应式）.rar
版权申诉
3 浏览量
2023-03-11
14:17:01
上传
评论
收藏 1.34MB RAR 举报
html5pc静态模板 紫色大屏创意设计模板 （含响应式）.rar （55个子文件） 
紫色大屏创意设计模板 js 
jquery.swipebox.min.js 7KB jquery-1.8.3.min.js 91KB easyResponsiveTabs.js 6KB circles.js 7KB jquery.mixitup.min.js 14KB jquery.flexisel.js 8KB scripts.js 4KB css style.css 41KB bootstrap.css 124KB swipebox.css 4KB
index.html 33KB images 
pic12.jpg 83KB pic5.jpg 41KB pic6.jpg 52KB
i5.png 3KB up-arrow.png 1KB i4.png 3KB pic10.jpg 93KB c3.png 6KB c1.png 7KB pic8.jpg 35KB banner.jpg 177KB banner4.jpg 155KB pic9.jpg 37KB logo.png 5KB client.png 4KB list-hover.png 84KB banner3.jpg 80KB pic4.jpg 64KB line.png 3KB icon3.jpg 14KB i3.png 3KB pic2.jpg 88KB clock.png 4KB icon2.jpg 14KB pic3.jpg 62KB month1.png 698B nav.png 3KB c4.png 7KB c2.png 6KB pic1.jpg 67KB
icons.svg 1KB icon1.jpg 14KB banner1.jpg 26KB img-sprite.png 25KB pic11.jpg 91KB pic7.jpg 76KB i2.png 3KB star.png 3KB banner2.jpg 28KB top-arrow.png 3KB project.png 3KB i1.jpg 12KB i6.png 3KB contact.jpg 49KB资源评论
