<!DOCTYPE html>
<html>
<head>
<title>Home </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all"/>
<script type="text/javascript" src="js/jquery.js"></script>
<!-- jQuery -->
<!--start slider-->
<link href="css/camera.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.min.js"></script>
<script type='text/javascript' src="js/jquery.mobile.customized.min.js"></script>
<script type='text/javascript' src="js/jquery.easing.1.3.js"></script>
<script type='text/javascript' src="js/camera.min.js"></script>
<script>
jQuery(function(){
jQuery('#camera_wrap_2').camera({
loader: 'bar',
pagination: false,
thumbnails: true
});
});
</script>
<!--end slider-->
<!--start gallery-->
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<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
$('#gallerylist').mixitup({
targetSelector: '.portfolio',
filterSelector: '.filter',
effects: ['fade'],
easing: 'snap',
// call the hover effect
onMixEnd: filterList.hoverEffect()
});
},
hoverEffect: function () {
// Simple parallax effect
$('#gallerylist .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>
<!--Add fancyBox main JS and CSS files-->
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('.popup-with-zoom-anim').magnificPopup({
type: 'inline',
fixedContentPos: false,
fixedBgPos: true,
overflowY: 'auto',
closeBtnInside: true,
preloader: false,
midClick: true,
removalDelay: 300,
mainClass: 'my-mfp-zoom-in'
});
});
</script>
</head>
<body>
<!--star-wrap-->
<div class="wrap">
<!--header-->
<div class="header">
<!--start-logo-->
<div class="logo">
<a href="index.html"><h1>jet<span>ro</span></h1></a>
</div>
<!--end-logo-->
<!--start-menu-->
<div class="menu">
<a class="toggleMenu" href="#"><img src="images/nav.png" alt= " " /></a>
<ul class="nav">
<li class="active"><a href="index.html">home</a></li>
<li ><a href="about.html">about us</a></li>
<li><a href="blog.html">blog</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="contact.html">contact us</a></li>
<div class="clear"> </div>
</ul>
<script type="text/javascript" src="js/responsive-nav.js"></script>
</div>
<div class="clear"> </div>
<!--end-menu-->
</div>
</div>
<!--end-header-->
<!--end wrap-->
<!-- start slider -->
<div class="main-con">
<div class="slider">
<div class="color"> <span> </span></div>
<div class="wrap">
<div class="fluid_container">
<div class="camera_wrap camera_magenta_skin" id="camera_wrap_2">
<div data-thumb="images/them1.png" data-src="images/slider1.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider one</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<div data-thumb="images/them2.jpg" data-src="images/slider2.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider two</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
</div>
</div>
<div data-thumb="images/them3.jpg" data-src="images/slider3.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider three</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<div data-thumb="images/them4.jpg" data-src="images/slider4.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider four</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
</div>
</div>
<div data-thumb="images/them2.jpg" data-src="images/slider2.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider ofive</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<div data-thumb="images/them6.jpg" data-src="images/slider6.jpg">
<div class="camera_caption fadeFromBottom">
<h2>slider six</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
</div><!-- #camera_wrap_2 -->
</div><!-- .fluid_container -->
<div class="clear"></div>
</div>
</div>
<!--end slider-->
<div class="copyrights">Collect from <a href="http://www.htmldivcss.com/" title="网站模板">网站模板</a></div>
<!--start home-page-con-->
<div class="home-page-con">
<div class="wrap">
<div class="top-grids">
<div class="top-grid">
<div class="top-grid-info">
<img src="images/por.png" style="margin-top: 4px;" alt=" "/>
<h2>check out my lastest portfolio items</h2>
<div class="clear"> </div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<a class="btn" href="portofolioitem.html">More</a>
</div>
<div class="top-grid">
<div class="top-grid-info">
<img src="images/wrok.png" alt=" "/>
<h2>check out my lastest portfolio items</h2>
<div class="clear"> </div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<a class="btn" href="portofolioitem.html">More</a>
</div>
<div class="top-grid">
<div class="top-grid-info">
<img src="images/connect.png" alt=" "/>
<h2>check out my lastest portfolio items</h2>
<div class="clear"> </div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor in
869_HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip
2 浏览量
2023-08-03
10:44:57
上传
评论
收藏 2.18MB ZIP 举报
869_HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip （61个子文件） 
869 
portfolio.html 12KB js 
jquery.magnific-popup.js 45KB fliplightbox.min.js 14KB camera.min.js 38KB jquery.easing.min.js 5KB responsive-nav.js 1KB jquery.mixitup.min.js 14KB jquery.easing.1.3.js 8KB jquery.js 262KB jquery.min.js 91KB jquery.mobile.customized.min.js 17KB
1.jpg 160KB css style.css 48KB camera.css 27KB JFAlert.css 3KB portofolioitem.html 10KB index.html 13KB contact.html 9KB about.html 11KB images line.jpg 23KB
plus.png 3KB spriteimg.png 7KB image1.jpg 78KB slider3.jpg 372KB them1.png 41KB image4.jpg 26KB por.png 4KB wrok.png 3KB them3.jpg 22KB image2.jpg 28KB image5.jpg 17KB jusesimg.jpg 43KB image12.jpg 11KB soc_media.png 25KB slidertextbg1.png 3KB them1.jpg 24KB image7.jpg 20KB slider6.jpg 141KB slider4.jpg 158KB image10.jpg 33KB image11.jpg 19KB nav.png 3KB image8.jpg 31KB them4.jpg 28KB image3.jpg 36KB slider2.jpg 237KB image9.jpg 33KB image6.jpg 26KB them6.jpg 18KB slider1.jpg 282KB connect.png 3KB popup.jpg 39KB them2.jpg 15KB aimg1.jpg 27KB blog.html 12KB fonts BEBAS___-webfont.ttf 23KB BEBAS___-webfont.eot 10KB OpenSans-Regular-webfont.eot 19KB BEBAS___-webfont.woff 12KB OpenSans-Regular-webfont.woff 22KB OpenSans-Regular-webfont.ttf 37KB资源评论
