You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
696 lines
39 KiB
696 lines
39 KiB
|
|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8"> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
<title>Yimian Page</title> |
|
<meta name="description" content=""> |
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
<link rel="apple-touch-icon" href="apple-touch-icon.png"> |
|
|
|
<link rel="stylesheet" href="index/css/bootstrap.min.css"> |
|
<link rel="stylesheet" href="index/css/bootstrap-theme.min.css"> |
|
<link rel="stylesheet" href="index/css/fontAwesome.css"> |
|
<link rel="stylesheet" href="index/css/light-box.css"> |
|
<link rel="stylesheet" href="index/css/owl-carousel.css"> |
|
<link rel="stylesheet" href="index/css/templatemo-style.css"> |
|
|
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet"> |
|
|
|
<script src="index/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script> |
|
</head> |
|
|
|
<body> |
|
|
|
|
|
|
|
<header class="nav-down responsive-nav hidden-lg hidden-md"> |
|
<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav"> |
|
<span class="sr-only">Toggle navigation</span> |
|
<span class="icon-bar"></span> |
|
<span class="icon-bar"></span> |
|
<span class="icon-bar"></span> |
|
</button> |
|
<!--/.navbar-header--> |
|
<div id="main-nav" class="collapse navbar-collapse"> |
|
<nav> |
|
<ul class="nav navbar-nav"> |
|
<li><a href="#top">Home</a></li> |
|
<li><a href="#featured">Featured</a></li> |
|
<li><a href="#projects">Recent Projects</a></li> |
|
<li><a href="#video">Presentation</a></li> |
|
<li><a href="#blog">Blog Entries</a></li> |
|
<li><a href="#contact">Contact Me</a></li> |
|
</ul> |
|
</nav> |
|
</div> |
|
</header> |
|
|
|
<div class="sidebar-navigation hidde-sm hidden-xs"> |
|
<div class="logo"> |
|
<a href="#">Yimian<em> Page</em></a> |
|
</div> |
|
<nav> |
|
<ul> |
|
<li> |
|
<a href="#top"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Home |
|
</a> |
|
</li> |
|
<li> |
|
<a href="#featured"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Featured |
|
</a> |
|
</li> |
|
<li> |
|
<a href="#projects"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Recent Work |
|
</a> |
|
</li> |
|
<li> |
|
<a href="#video"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Presentation |
|
</a> |
|
</li> |
|
<li> |
|
<a href="#blog"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Blog Entires |
|
</a> |
|
</li> |
|
<li> |
|
<a href="#contact"> |
|
<span class="rect"></span> |
|
<span class="circle"></span> |
|
Contact Me |
|
</a> |
|
</li> |
|
</ul> |
|
</nav> |
|
<ul class="social-icons"> |
|
<li><a href="#"><i class="fa fa-facebook"></i></a></li> |
|
<li><a href="#"><i class="fa fa-twitter"></i></a></li> |
|
<li><a href="#"><i class="fa fa-linkedin"></i></a></li> |
|
<li><a href="#"><i class="fa fa-rss"></i></a></li> |
|
<li><a href="#"><i class="fa fa-behance"></i></a></li> |
|
</ul> |
|
</div> |
|
|
|
<div class="slider"> |
|
<div class="Modern-Slider content-section" id="top"> |
|
<!-- Item --> |
|
<div class="item item-1"> |
|
<div class="img-fill"> |
|
<div class="image"></div> |
|
<div class="info"> |
|
<div> |
|
<h1>Yimian Cloud<br></h1> |
|
<p>Aimming to provide the best cloud stroage service.<br> |
|
Click the following button for more infomation.</p> |
|
<div class="white-button button"> |
|
<a href="https://cloud.yimian.xyz">Discover More</a> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<!-- // Item --> |
|
<!-- Item --> |
|
<div class="item item-2"> |
|
<div class="img-fill"> |
|
<div class="image"></div> |
|
<div class="info"> |
|
<div> |
|
<h1>Yimian SSR<br></h1> |
|
<p>Experience Service OUT OF CHINA for FREE. |
|
<br>Runing with 10MB/s STABLY!</p> |
|
|
|
<div class="white-button button"> |
|
<a href="https://cn.yimian.xyz/ssr">Discover More</a> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<!-- // Item --> |
|
<!-- Item --> |
|
<div class="item item-3"> |
|
<div class="img-fill"> |
|
<div class="image"></div> |
|
<div class="info"> |
|
<div> |
|
<h1>Yimian Video<br></h1> |
|
<p>Share Video with the one You Love!</p> |
|
|
|
<div class="white-button button"> |
|
<a href="https://www.yimian.xyz/video">Discover More</a> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<!-- // Item --> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="page-content"> |
|
<section id="featured" class="content-section"> |
|
<div class="section-heading"> |
|
<h1>Featured<br><em>Places</em></h1> |
|
<p>Praesent pellentesque efficitur magna, |
|
<br>sed pellentesque neque malesuada vitae.</p> |
|
</div> |
|
<div class="section-content"> |
|
<div class="owl-carousel owl-theme"> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_1.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Lorem ipsum dolor</h4> |
|
<span>Proin et sapien</span> |
|
<p>#1 Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed at massa turpis. Fusce ut pretium dui, vitae ullamcorper velit.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_2.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Phasellus a lacus ac odio</h4> |
|
<span>Maximus</span> |
|
<p>#2 Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed at massa turpis. Fusce ut pretium dui, vitae ullamcorper velit.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_3.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Proin sit amet fringilla</h4> |
|
<span>Vulputate</span> |
|
<p>#3 Aliquam mollis lacus eget metus efficitur lobortis. Suspendisse libero lacus, accumsan vitae commodo tristique, luctus gravida metus.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_2.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>In volutpat augue lectus</h4> |
|
<span>Elementum</span> |
|
<p>#4 Aliquam mollis lacus eget metus efficitur lobortis. Suspendisse libero lacus, accumsan vitae commodo tristique, luctus gravida metus.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_1.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Cras commodo odio</h4> |
|
<span>Aliquam</span> |
|
<p>#5 Mauris lacinia pretium libero, ut tincidunt lacus molestie ornare. Phasellus a facilisis erat. Praesent eleifend nibh mauris, quis sodales lorem convallis pulvinar.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_3.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Sed at massa turpis</h4> |
|
<span>Curabitur</span> |
|
<p>#6 Vestibulum tincidunt ornare ligula vel molestie. Curabitur hendrerit mauris mollis ipsum vulputate rutrum. Phasellus luctus odio eget dui imperdiet.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_2.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Aliquam mollis lacus</h4> |
|
<span>Suspendisse</span> |
|
<p>#7 Suspendisse suscipit nulla sed nisl fermentum, auctor suscipit nunc rhoncus. Proin faucibus metus diam, nec hendrerit purus pharetra in.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_1.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Mauris lacinia pretium</h4> |
|
<span>Vestibulum</span> |
|
<p>#8 Suspendisse suscipit nulla sed nisl fermentum, auctor suscipit nunc rhoncus. Proin faucibus metus diam, nec hendrerit purus pharetra in.</p> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="image"> |
|
<img src="index/img/featured_3.jpg" alt=""> |
|
<div class="featured-button button"> |
|
<a href="#projects">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="text-content"> |
|
<h4>Proin sit amet fringilla erat</h4> |
|
<span>Convallis</span> |
|
<p>#9 Suspendisse suscipit nulla sed nisl fermentum, auctor suscipit nunc rhoncus. Proin faucibus metus diam, nec hendrerit purus pharetra in.</p> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</section> |
|
<section id="projects" class="content-section"> |
|
<div class="section-heading"> |
|
<h1>Recent<br><em>Projects</em></h1> |
|
<p>Praesent pellentesque efficitur magna, |
|
<br>sed pellentesque neque malesuada vitae.</p> |
|
</div> |
|
<div class="section-content"> |
|
<div class="masonry"> |
|
<div class="row"> |
|
<div class="item"> |
|
<div class="col-md-8"> |
|
<a href="index/img/portfolio_big_1.jpg" data-lightbox="image"><img src="index/img/portfolio_1.jpg" alt="image 1"></a> |
|
</div> |
|
</div> |
|
<div class="item second-item"> |
|
<div class="col-md-4"> |
|
<a href="index/img/portfolio_big_2.jpg" data-lightbox="image"><img src="index/img/portfolio_2.jpg" alt="image 2"></a> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="col-md-4"> |
|
<a href="index/img/portfolio_big_3.jpg" data-lightbox="image"><img src="index/img/portfolio_3.jpg" alt="image 3"></a> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="col-md-4"> |
|
<a href="index/img/portfolio_big_4.jpg" data-lightbox="image"><img src="index/img/portfolio_4.jpg" alt="image 4"></a> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<div class="col-md-8"> |
|
<a href="index/img/portfolio_big_5.jpg" data-lightbox="image"><img src="index/img/portfolio_5.jpg" alt="image 5"></a> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> <div class="tlinks">Collect from <a href="http://www.cssmoban.com/" title="网站模板">网站模板</a></div> |
|
</section> |
|
<section id="video" class="content-section"> |
|
<div class="row"> |
|
<div class="col-md-12"> |
|
<div class="section-heading"> |
|
<h1>This is a <em>company</em> presentation.</h1> |
|
<p>Praesent pellentesque efficitur magna, sed pellentesque neque malesuada vitae.</p> |
|
</div> |
|
<div class="text-content"> |
|
<p>In eget ipsum sed lorem vehicula luctus. Curabitur non dolor rhoncus, hendrerit justo sit amet, vestibulum turpis. Pellentesque id auctor tellus, vel ultricies augue. Duis condimentum aliquet blandit. Fusce rhoncus et eros ut pharetra. Phasellus convallis ultricies ligula ac gravida.</p> |
|
</div> |
|
<div class="accent-button button"> |
|
<a href="#blog">Continue Reading</a> |
|
</div> |
|
</div> |
|
<div class="col-md-12"> |
|
<div class="box-video"> |
|
<div class="bg-video" style="background-image: url(https://unsplash.imgix.net/photo-1425036458755-dc303a604201?fit=crop&fm=jpg&q=75&w=1000);"> |
|
<div class="bt-play">Play</div> |
|
</div> |
|
<div class="video-container" style="height: 400px;"> |
|
<video tabindex="0" controls="" preload="none" > |
|
<source src="https://uk.cloud.yimian.xyz/index.php/s/WFF7kKrbB9XLCCH/download?path=%2F&files=1.mp4" type="video/mp4" /> |
|
</video> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</section> |
|
<section id="blog" class="content-section"> |
|
<div class="section-heading"> |
|
<h1><a href="blog/">Blog<br><em>Entries</em></a></h1> |
|
<p>Curabitur hendrerit mauris mollis ipsum vulputate rutrum. |
|
<br>Phasellus luctus odio eget dui imperdiet.</p> |
|
</div> |
|
<div class="section-content"> |
|
<div class="tabs-content"> |
|
<div class="wrapper"> |
|
<ul class="tabs clearfix" data-tabgroup="first-tab-group"> |
|
<li><a href="#tab1" class="active">July 2018</a></li> |
|
<li><a href="#tab2">June 2018</a></li> |
|
<li><a href="#tab3">May 2018</a></li> |
|
<li><a href="#tab4">April 2018</a></li> |
|
</ul> |
|
<section id="first-tab-group" class="tabgroup"> |
|
<div id="tab1"> |
|
<ul> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_1.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Integer ultrices augue</h4> |
|
<span>25 July 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_2.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Cras commodo odio ut</h4> |
|
<span>16 July 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_3.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Sed at massa turpis</h4> |
|
<span>10 July 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
</ul> |
|
</div> |
|
<div id="tab2"> |
|
<ul> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_3.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Sed at massa turpis</h4> |
|
<span>30 June 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_1.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Lorem ipsum dolor sit</h4> |
|
<span>24 June 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_2.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Cras commodo odio ut</h4> |
|
<span>12 June 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
</ul> |
|
</div> |
|
<div id="tab3"> |
|
<ul> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_2.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Cras commodo odio ut</h4> |
|
<span>26 May 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_1.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Lorem ipsum dolor sit</h4> |
|
<span>22 May 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_3.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Integer ultrices augue</h4> |
|
<span>8 May 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
</ul> |
|
</div> |
|
<div id="tab4"> |
|
<ul> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_1.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Lorem ipsum dolor sit</h4> |
|
<span>26 April 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_3.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Integer ultrices augue eu</h4> |
|
<span>24 April 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
<li> |
|
<div class="item"> |
|
<img src="index/img/blog_2.jpg" alt=""> |
|
<div class="text-content"> |
|
<h4>Cras commodo odio ut</h4> |
|
<span>20 April 2018</span> |
|
<p>Nam vel egestas nisi. Nullam lobortis magna at enim venenatis luctus. Nam finibus, mauris eu dictum iaculis, dolor tortor cursus quam, in volutpat augue lectus sed magna. Integer mollis lorem quis ipsum maximus finibus.</p> |
|
|
|
<div class="accent-button button"> |
|
<a href="#contact">Continue Reading</a> |
|
</div> |
|
</div> |
|
</div> |
|
</li> |
|
</ul> |
|
</div> |
|
</section> |
|
</div> |
|
</div> |
|
</div> |
|
</section> |
|
<section id="contact" class="content-section"> |
|
<div id="map"> |
|
|
|
<!-- How to change your own map point |
|
1. Go to Google Maps |
|
2. Click on your location point |
|
3. Click "Share" and choose "Embed map" tab |
|
4. Copy only URL and paste it within the src="" field below |
|
--> |
|
map |
|
</div> |
|
<div id="contact-content"> |
|
<div class="section-heading"> |
|
<h1>Contact<br><em>Sentra</em></h1> |
|
<p>Curabitur hendrerit mauris mollis ipsum vulputate rutrum. |
|
<br>Phasellus luctus odio eget dui imperdiet.</p> |
|
|
|
</div> |
|
<div class="section-content"> |
|
<form id="contact" action="#" method="post"> |
|
<div class="row"> |
|
<div class="col-md-4"> |
|
<fieldset> |
|
<input name="name" type="text" class="form-control" id="name" placeholder="Your name..." required=""> |
|
</fieldset> |
|
</div> |
|
<div class="col-md-4"> |
|
<fieldset> |
|
<input name="email" type="email" class="form-control" id="email" placeholder="Your email..." required=""> |
|
</fieldset> |
|
</div> |
|
<div class="col-md-4"> |
|
<fieldset> |
|
<input name="subject" type="text" class="form-control" id="subject" placeholder="Subject..." required=""> |
|
</fieldset> |
|
</div> |
|
<div class="col-md-12"> |
|
<fieldset> |
|
<textarea name="message" rows="6" class="form-control" id="message" placeholder="Your message..." required></textarea> |
|
</fieldset> |
|
</div> |
|
<div class="col-md-12"> |
|
<fieldset> |
|
<button type="submit" id="form-submit" class="btn">Send Message Now</button> |
|
</fieldset> |
|
</div> |
|
</div> |
|
</form> |
|
</div> |
|
</div> |
|
</section> |
|
<section class="footer"> |
|
<p>Copyright © 2018 Company Name . Design: <a href="" target="_blank">Sentra</a> More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p> |
|
</section> |
|
</div> |
|
|
|
|
|
|
|
<script src="https://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script> |
|
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script> |
|
|
|
<script src="index/js/vendor/bootstrap.min.js"></script> |
|
|
|
<script src="index/js/plugins.js"></script> |
|
<script src="index/js/main.js"></script> |
|
|
|
<script> |
|
// Hide Header on on scroll down |
|
var didScroll; |
|
var lastScrollTop = 0; |
|
var delta = 5; |
|
var navbarHeight = $('header').outerHeight(); |
|
|
|
$(window).scroll(function(event){ |
|
didScroll = true; |
|
}); |
|
|
|
setInterval(function() { |
|
if (didScroll) { |
|
hasScrolled(); |
|
didScroll = false; |
|
} |
|
}, 250); |
|
|
|
function hasScrolled() { |
|
var st = $(this).scrollTop(); |
|
|
|
// Make sure they scroll more than delta |
|
if(Math.abs(lastScrollTop - st) <= delta) |
|
return; |
|
|
|
// If they scrolled down and are past the navbar, add class .nav-up. |
|
// This is necessary so you never see what is "behind" the navbar. |
|
if (st > lastScrollTop && st > navbarHeight){ |
|
// Scroll Down |
|
$('header').removeClass('nav-down').addClass('nav-up'); |
|
} else { |
|
// Scroll Up |
|
if(st + $(window).height() < $(document).height()) { |
|
$('header').removeClass('nav-up').addClass('nav-down'); |
|
} |
|
} |
|
|
|
lastScrollTop = st; |
|
} |
|
</script> |
|
|
|
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> |
|
|
|
<script>//log visit |
|
|
|
var url=window.location.pathname+window.location.search; |
|
var domain= document.domain; |
|
|
|
|
|
$.ajax({ |
|
type: "POST", |
|
url: '/log.php', |
|
data: { "url": url, |
|
"domain": domain},//使用这种数组方式的，得加下一句才可以，使用传统方式 |
|
traditional: true, |
|
dataType: 'json', |
|
error: function (data,type, err) { |
|
alert('Could not log your visit!'); |
|
} |
|
}); |
|
</script> |
|
|
|
</body> |
|
</html> |