<!--A Design by W3layouts
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hangout a Travel Category Flat Bootstrap 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="Hangout Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- css -->
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="css/swipebox.css">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css" media="all" />
<!--// css -->
<!-- font -->
<link href="//fonts.googleapis.com/css?family=Marck+Script" rel="stylesheet">
<link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css'>
<!-- //font -->
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.js"></script>
<!-- start-smooth-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>
<!-- //start-smoth-scrolling -->
<!-- here stars scrolling icon -->
<script type="text/javascript">
$(document).ready(function() {
/*
var defaults = {
containerID: 'toTop', // fading element id
containerHoverID: 'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
};
*/
$().UItoTop({ easingType: 'easeOutQuart' });
});
</script>
<!-- swipe box js -->
<script src="js/jquery.swipebox.min.js"></script>
<script type="text/javascript">
jQuery(function($) {
$(".swipebox").swipebox();
});
</script>
<!-- //swipe box js -->
</head>
<body>
<div class="top-header-agile">
<div class="container">
<div class="col-md-6 top-header-agile-left">
<ul>
<li><i class="fa fa-phone" aria-hidden="true"></i></li>
<li>+18084563326</li>
<li><i class="fa fa-envelope" aria-hidden="true"></i></li>
<li><a href="mailto:info@example.com">info@example.com</a></li>
</ul>
</div>
<div class="col-md-6 top-header-agile-right">
<ul>
<li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="banner" id="home">
<div class="header-bottom">
<div class="container">
<div class="fixed-header">
<!--logo-->
<div class="logo">
<a href="index.html"><h1>Hangout</h1></a>
</div>
<!--//logo-->
<nav class="navbar navbar-default cl-effect-16" id="cl-effect-16">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div id="navbar" class="navbar-collapse navbar-right collapse hover-effect">
<ul class="nav navbar-nav">
<li><a class="scroll" href="#home">HOME</a></li>
<li><a href="#about" class="scroll">ABOUT</a></li>
<li><a href="#gallery" class="scroll">GALLERY</a></li>
<li><a href="#team" class="scroll">TEAM</a></li>
<li ><a class="scroll" href="#contact">CONTACT</a></li>
</ul>
</div>
</nav>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="banner-slider w3layouts">
<div class="callbacks_container">
<ul class="rslides" id="slider4">
<li>
<div class="banner-info">
<h3>To Travel</h3>
<p>IS TO LIVE</p>
<div class="arrows"><img src="images/border.png" alt="border"/></div>
<span>ENJOY THE MOMENT</span>
</div>
</li>
<li>
<div class="banner-info">
<h3>To Travel</h3>
<p>IS TO EXPLORE</p>
<div class="arrows"><img src="images/border.png" alt="border"/></div>
<span>ENJOY THE MOMENT</span>
</div>
</li>
<li>
<div class="banner-info">
<h3>To Travel</h3>
<p>IS TO DISCOVER</p>
<div class="arrows"><img src="images/border.png" alt="border"/></div>
<span>ENJOY THE MOMENT</span>
</div>
</li>
</ul>
</div>
<!--banner Slider starts Here-->
<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>
<!--banner Slider starts Here-->
</div>
</div>
<!-- About-->
<div class="about-w3" id="about">
<div class="container">
<div class="col-md-6 about-left-w3l">
<h2>About</h2>
<p>Suspendisse molestie lorem eu felis congue, maximus convallis mi bibendum. Curabitur est tortor, hendrerit eu velit quis, vestibulum cursus ligula.</p>
<div class="about-left-wthree">
<div class="about-left-w3l-sec1">
<div class="col-md-2 about-left-icon-w3ls">
<i class="fa fa-envira" aria-hidden="true"></i>
</div>
<div class="col-md-10 about-left-text-w3ls">
<h4>Fusce at augue</h4>
<p>Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce ornare, mauris id ultricies dapibus</p>
</div>
<div class="clearfix"></div>
</div>
<div class="about-left-w3l-sec2">
<div class="col-md-2 about-left-icon-w3ls">
<i class="fa fa-anchor" aria-hidden="true"></i>
</div>
<div class="col-md-10 about-left-text-w3ls">
<h4>Fusce at augue</h4>
<p>Fusce eleifend, tellus fermentum placerat posuere, ligula felis hendrerit nisl, vitae bibendum nisl purus sit amet nisi.</p>
</div>
<div class="clearfix"></div>
</div>
<div class="about-left-w3l-sec3">
<div class="col-md-2 about-left-icon-w3ls">
<i class="fa fa-heart" aria-hidden="true"></i>
</div>
<div class="col-md-10 about-left-text-w3ls">
<h4>Fusce at augue</h4>
<p> Vestibulum fermentum, risus ut maximus pellentesque, dolor lorem pretium nunc</p>
</div>
<div class="clearfix"></div>
</div>
毕设&课设&大作业-旅行之家响应式网站模板-适配移动端-HTML网站源码.zip
版权申诉
120 浏览量
2024-03-29
11:28:44
上传
评论
收藏 2.46MB ZIP 举报
毕设&课设&大作业-旅行之家响应式网站模板-适配移动端-HTML网站源码.zip （44个子文件） 
毕设&课设&大作业-旅行之家响应式网站模板-适配移动端-HTML网站源码 html js 
bootstrap.js 66KB jquery.swipebox.min.js 7KB responsiveslides.min.js 3KB easing.js 5KB move-top.js 1KB jquery-1.11.1.min.js 94KB css style.css 30KB bootstrap.css 143KB font-awesome.min.css 28KB swipebox.css 4KB
index.html 22KB images 
g3.jpg 75KB g2.jpg 110KB b1.jpg 32KB news.jpg 138KB
up-arrow.png 3KB b2.jpg 29KB g8.jpg 97KB about.jpg 264KB border.png 4KB banner.jpg 171KB t3.jpg 7KB newsbg.jpg 477KB g7.jpg 124KB g6.jpg 50KB t1.jpg 12KB
icons.svg 1KB t4.jpg 10KB servicesbg.jpg 101KB g5.jpg 82KB t2.jpg 14KB g4.jpg 63KB contactbg.jpg 63KB g1.jpg 86KB fonts FontAwesome.otf 122KB glyphicons-halflings-regular.ttf 44KB glyphicons-halflings-regular.woff 23KB glyphicons-halflings-regular.eot 20KB fontawesome-webfont.eot 75KB glyphicons-halflings-regular.woff2 18KB fontawesome-webfont.woff 88KB fontawesome-webfont.woff2 70KB fontawesome-webfont.svg 382KB fontawesome-webfont.ttf 149KB资源评论
