网站前端网页源码模板(662).zip资源-CSDN文库

共61个文件

jpg：27个

js：10个

png：9个

版权申诉

71 浏览量 2021-09-24 22:34:33 上传评论收藏 2.18MB ZIP 举报

资源详情

资源评论

资源推荐

收起资源包目录

网站前端网页源码模板 (662).zip （61个子文件）

portofolioitem.html 10KB

css

camera.css 27KB

JFAlert.css 3KB

style.css 48KB

images

image2.jpg 28KB

slider3.jpg 372KB

image6.jpg 26KB

them2.jpg 15KB

por.png 4KB

slider6.jpg 141KB

image9.jpg 33KB

image11.jpg 19KB

soc_media.png 25KB

image7.jpg 20KB

image4.jpg 26KB

slider4.jpg 158KB

line.jpg 23KB

them3.jpg 22KB

image12.jpg 11KB

image5.jpg 17KB

slidertextbg1.png 3KB

them4.jpg 28KB

them6.jpg 18KB

nav.png 3KB

connect.png 3KB

image1.jpg 78KB

them1.png 41KB

image3.jpg 36KB

image8.jpg 31KB

spriteimg.png 7KB

slider2.jpg 237KB

jusesimg.jpg 43KB

slider1.jpg 282KB

popup.jpg 39KB

image10.jpg 33KB

wrok.png 3KB

plus.png 3KB

them1.jpg 24KB

aimg1.jpg 27KB

1.jpg 160KB

fonts

OpenSans-Regular-webfont.eot 19KB

OpenSans-Regular-webfont.ttf 37KB

BEBAS___-webfont.eot 10KB

OpenSans-Regular-webfont.woff 22KB

BEBAS___-webfont.woff 12KB

BEBAS___-webfont.ttf 23KB

index.html 13KB

jquery.js 262KB

jquery.min.js 91KB

jquery.easing.min.js 5KB

jquery.magnific-popup.js 45KB

jquery.mixitup.min.js 14KB

jquery.mobile.customized.min.js 17KB

jquery.easing.1.3.js 8KB

fliplightbox.min.js 14KB

responsive-nav.js 1KB

camera.min.js 38KB

blog.html 12KB

portfolio.html 12KB

about.html 11KB

contact.html 9KB

<!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>   <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>   <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>  <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>  <div class="wrap">  <div class="header">  <div class="logo"> <a href="index.html"><h1>jet<span>ro</span></h1></a> </div>   <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>  </div> </div>    <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> </div> <div class="clear"></div> </div> </div>  <div class="copyrights">Collect from <a href="http://www.htmldivcss.com/" title="网站模板">网站模板</a></div>  <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