<!DOCTYPE html>
<html>
<head>
<title>Gallery</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"/>
<!--web-fonts-->
<link href='http://fonts.useso.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
<!--js-->
<script src="js/jquery.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); }>
</script>
<meta name="keywords" content="My Charity Responsive web template, Bootstrap Web Templates, Flat Web Templates, AndriodCompatible web template, Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<!-- 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},1000);
});
});
</script>
<!-- //end-smoth-scrolling -->
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
<link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
<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>
<!--header start here-->
<div class="mothergrid">
<div class="container">
<div class="header">
<div class="logo">
<a href="index.html"> <img src="images/logo.png" alt=""/> </a>
</div>
<span class="menu"> <img src="images/icon.png" alt=""/></span>
<div class="clear"> </div>
<div class="navg">
<ul class="res">
<li><a href="index.html">HOME</a></li>
<li><a href="about.html">ABOUT US</a></li>
<li><a href="projects.html">PROJECTS</a></li>
<li><a href="blog.html">BLOG</a></li>
<li><a href="events.html">EVENTS</a></li>
<li><a class="active" href="gallery.html">GALLERY</a></li>
<li><a href="contact.html">CONTACT US</a></li>
</ul>
<script>
$( "span.menu").click(function() {
$( "ul.res" ).slideToggle("slow", function() {
// Animation complete.
});
});
</script>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<!--header end here-->
<!--gallery start here-->
<div class="gallery">
<div class="wrap">
<div class="gallery-main">
<h3>GALLERY</h3>
<div class='container services_top'>
<div class="portfolio_top">
<div class="col_1_of_portfolio span_1_of_portfolio">
<div class="view view-first">
<img src="images/boy.jpg" class="img-responsive" alt=""/>
<div class="mask">
<a class="popup-with-zoom-anim" href="#small-dialog1"> <div class="info"><img src="images/magnifier.png" alt=""/></div></a>
<div id="small-dialog1" class="mfp-hide">
<div class="pop_up2">
<img src="images/boy.jpg" class="img-responsive" alt=""/>
<h3 class="popup"><a href="#">augue duis dolore te feugait</a></h3>
<p class="m_5">claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius.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>
</div>
</div>
<div class="col_1_of_portfolio span_1_of_portfolio">
<div class="view view-first">
<img src="images/sing.jpg" class="img-responsive" alt=""/>
<div class="mask">
<a class="popup-with-zoom-anim" href="#small-dialog2"> <div class="info"><img src="images/magnifier.png" alt=""/></div></a>
<div id="small-dialog2" class="mfp-hide">
<div class="pop_up2">
<img src="images/sing.jpg" class="img-responsive" alt=""/>
<h3 class="popup"><a href="#">augue duis dolore te feugait</a></h3>
<p class="m_5">claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius.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>
</div>
</div>
<div class="col_1_of_portfolio span_1_of_portfolio">
<div class="view view-first">
<img src="images/poli.jpg" class="img-responsive" alt=""/>
<div class="mask">
<a class="popup-with-zoom-anim" href="#small-dialog3"> <div class="info"><img src="images/magnifier.png" alt=""/></div></a>
<div id="small-dialog3" class="mfp-hide">
<div class="pop_up2">
<img src="images/poli.jpg" class="img-responsive" alt=""/>
<h3 class="popup"><a href="#">augue duis dolore te feugait</a></h3>
<p class="m_5">claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius.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>
</div>
</div>
<div class="clearfix"> </div>
</div>
<div class="portfolio_top">
<div class="col_1_of_portfolio span_1_of_portfolio">
<div class="view view-first">
<img src="images/mom.jpg" class="img-responsive" alt=""/>
<div class="mask">
<a class="popup-with-zoom-anim" href="#small-dialog4"> <div class="info"><img src="images/magnifier.png" alt=""/></div></a>
<div id="small-dialog4" class="mfp-hide">
<div class="pop_up2">
<img src="images/mom.jpg" class="img-responsive" alt=""/>
<h3 class="popup"><a href="#">augue duis dolore te feugait</a></h3>
<p class="m_5">claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod t
html5pc静态模板 仿win8磁贴设计遍平化企业整站模板 （含响应式）.zip
版权申诉
123 浏览量
2023-03-11
14:09:11
上传
评论
收藏 2.51MB ZIP 举报
html5pc静态模板 仿win8磁贴设计遍平化企业整站模板 （含响应式）.zip （59个子文件） 
仿win8磁贴设计遍平化企业整站模板 页面 
events.html 9KB js 
jquery.magnific-popup.js 45KB easing.js 5KB move-top.js 1KB jquery.min.js 92KB css style.css 44KB magnific-popup.css 15KB bootstrap.css 118KB projects.html 6KB index.html 8KB contact.html 7KB about.html 8KB single.html 10KB images 
poli.jpg 13KB e3.jpg 32KB gl.jpg 7KB leaf.jpg 64KB
arrow.png 842B sea.png 433B sing.jpg 14KB banner.jpg 43KB logo.png 7KB e4.jpg 42KB blg3.jpg 26KB text.png 325B box.png 110B bi.jpg 20KB green-grace-c.jpg 45KB person.png 341B aro.png 543B qua.jpg 14KB boy.jpg 10KB holiday.jpg 46KB g.png 707B per.png 458B e1.jpg 59KB ey.png 3KB sprit.png 2KB man.jpg 5KB e2.jpg 26KB mom.jpg 32KB scroll.png 852B gl-1.jpg 8KB f.png 711B grace.jpg 53KB b.png 516B t.png 524B blg1.jpg 33KB fa.png 282B unl.png 243B grid-n.png 10KB icon.png 154B arrow1.png 1KB ima.png 424B blg2.jpg 54KB magnifier.png 2KB blog.html 10KB gallery.html 13KB index.png 1.76MB资源评论
