<!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-->
<!--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 incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut a
卡通_HTML手机电脑网站_网页源码移动端前端js效果_H5模板_自适应css源码ui组件.zip
192 浏览量
2023-08-03
10:55:03
上传
评论
收藏 2.05MB ZIP 举报
卡通_HTML手机电脑网站_网页源码移动端前端js效果_H5模板_自适应css源码ui组件.zip （60个子文件） 
卡通 
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 css style.css 45KB 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资源评论
qq_41146932
- 粉丝: 9
- 资源: 6308
最新资源
- Anaconda3-2024.02-1-Windows-x86-64.exe
- stm32cubemx can通信 一个板子负责传感器采集 一个板子负责wifi传递到网页 网页可控制传感器板子.zip
- k8s集群搭建1.27.1版本（来源于图灵k8s笔记）
- 树莓派连接 DS18B20 温度传感器读取温度时监控客户端，服务器端连接状况，实现断线重连机制
- 小游戏-坦克大战，你认为的小游戏
- 最好用的富文本编辑器wangeditor
- jQuery 3.7.1
- 校园失物招领小程序源码可作毕业设计
- SAP客户端GUI740安装包（JAVA版本）
- winlibs-x86-64-posix-seh-gcc-13.2.0-llvm-16.0.6-mingw-w64msvcrt
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
