社交APP视频介绍响应式网页模板.7z资源-CSDN文库

共44个文件

png：26个

js：8个

css：5个

HTML

源码

响应式网站

课程设计

期末大作业

需积分: 5 6 浏览量 2024-06-20 08:47:15 上传评论收藏 1.92MB 7Z 举报

资源推荐

资源详情

资源评论

收起资源包目录

社交APP视频介绍响应式网页模板.7z （44个子文件）

社交APP视频介绍响应式网页模板

html

jquery.magnific-popup.js 45KB

responsiveslides.min.js 3KB

modernizr.custom.53451.js 7KB

easing.js 5KB

jquery-1.11.0.min.js 94KB

classie.js 2KB

move-top.js 1KB

owl.carousel.js 37KB

css

style.css 41KB

owl.carousel.css 8KB

popuo-box.css 4KB

bootstrap.css 118KB

owl.theme.css 2KB

index.html 16KB

contact.html 6KB

images

p-1.png 92KB

fthr-2.png 3KB

mobile.png 155KB

mobile-2.png 101KB

fthr-3.png 5KB

up-arrow.png 1KB

v-2.png 5KB

mobile-1.png 185KB

menu.png 3KB

banner.jpg 174KB

logo.png 6KB

d-1.png 4KB

client-2.png 45KB

price-banner.jpg 95KB

client-1.png 24KB

act-banner.jpg 239KB

scr-2.png 143KB

scr-3.png 122KB

v-3.png 6KB

fthr-4.png 11KB

video.png 6KB

scr-1.png 106KB

v-4.png 6KB

vedio-bnr.png 348KB

d-3.png 5KB

fthr-1.png 6KB

client-3.png 44KB

d-4.png 5KB

v-1.png 4KB

<!DOCTYPE html> <html> <head> <title>ECNO a Landingpage Multipurpose Flat Bootstarp responsive Website Template| HOME :: w3layouts</title> <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="ECNO 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="css/bootstrap.css" rel='stylesheet' type='text/css' /> <link href="css/style.css" rel='stylesheet' type='text/css' /> <script src="js/jquery-1.11.0.min.js"></script> <link href='http://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900' rel='stylesheet' type='text/css'>  <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>   <link href="css/owl.carousel.css" rel="stylesheet"> <link href="css/owl.theme.css" rel="stylesheet"> <script src="js/owl.carousel.js"></script> <script> $(document).ready(function() { $("#owl-demo").owlCarousel({ navigation: true, navigationText: [ "<i class='icon-chevron-left icon-white'></i>", "<i class='icon-chevron-right icon-white'></i>" ], items :3, slideSpeed :100, lazyLoad : true, autoPlay : true, }); }); </script>  </head> <body>  <div id="home" class="banner"> <div class="header-info"> <div class="header-info-left"> <div class="logo"> <a href="index.html"><img src="images/logo.png" class="img-responsive" alt=""/></a> </div> </div> <div class="header-info-right"> <div class="header cbp-spmenu-push"> <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2"> <a href="index.html">Home</a> <a class="scroll" href="#feathure">Feathure</a> <a class="scroll" href="#demo">Demo</a> <a href="contact.html">Contact</a> </nav>  <script> $("span.menu").click(function(){ $("ul.navigatoin").slideToggle("300" , function(){ }); }); </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> <div class="clearfix"> </div>  <div class="main"> <section class="buttonset"> <button id="showRightPush"><img src="images/menu.png" /></button> </section> </div>  <script src="js/classie.js"></script> <script> var menuRight = document.getElementById( 'cbp-spmenu-s2' ), showRightPush = document.getElementById( 'showRightPush' ), body = document.body; showRightPush.onclick = function() { classie.toggle( this, 'active' ); classie.toggle( body, 'cbp-spmenu-push-toleft' ); classie.toggle( menuRight, 'cbp-spmenu-open' ); disableOther( 'showRightPush' ); }; </script> </div> </div> <div class="clearfix"> </div> </div> <div class="banner-bottom"> <div class="col-md-6 banner-left"> <h1>ECNO IS GREAT APPS</h1> <p>Almost everyday I receive at least 1 email asking; How I became self-taught designer? If I can recommend any book, course? If I have any advise? Rather than keep replying those emails individually, I wanted to write this short post. I will be talking about design, but the things you will be reading can be applied to pretty much everything.</p> <ul> <li><a href="#">APPS</a></li> <li><a class="active" href="#">DOWNLOAD</a></li> </ul> </div> <div class="col-md-6 banner-right"> <div id="top" class="callbacks_container"> <ul class="rslides" id="slider4"> <li> <img src="images/mobile.png" alt="" /> </li> <li> <img src="images/mobile-1.png" alt="" /> </li> <li> <img src="images/mobile.png" alt="" /> </li> <li> <img src="images/mobile-2.png" alt="" /> </li> </ul> </div> <div class="clearfix"> </div> </div> <div class="clearfix"></div> </div> <div class="arrow"> <a href="#feathure" class="scroll"><img src="images/d-1.png" alt="" /></a> </div> </div>   <script src="js/responsiveslides.min.js"></script> <script> // You can also use "$(window).load(function() {" $(function () { // Slideshow 4 $("#slider4").responsiveSlides({ auto: true, pager: true, nav: false, speed: 500, namespace: "callbacks", before: function () { $('.events').append("<li>before event fired.</li>"); }, after: function () { $('.events').append("<li>after event fired.</li>"); } }); }); </script>   <div class="feathure" id="feathure"> <div class="feathure-main"> <div class="feathure-top"> <h2>Feathure</h2> <p>I will be talking about design, but the things you will be reading can be applied to pretty much everything.</p> </div> </div> <div class="feathure-bottom"> <div class="feathure-left"> <img src="images/fthr-1.png" alt="" /> </div> <div class="feathure-right"> <img src="images/fthr-2.png" alt="" /> </div> <div class="clearfix"></div> <div class="feathure-left1"> <img src="images/fthr-3.png" alt="" /> </div> <div class="feathure-right1"> <img src="images/fthr-4.png" alt="" /> </div> <div class="clearfix"></div> </div> </div>   <div class="video" id="demo"> <div class="video-main"> <a class="play-icon popup-with-zoom-anim" href="#small-dialog5"><span> </span></a><br /> </div> </div>   <div id="small-dialog5" class="mfp-hide"> <iframe src="https://player.vimeo.com/video/35354673?color=56a0d3&title=0&byline=0&portrait=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> </div> <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' });

评论收藏

内容反馈