<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css'/>
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all"/>
<script src="js/jquery.easing.min.js"></script>
<link href='http://fonts.useso.com/css?family=Raleway:400,100,300,500,700,800,900,600,200' rel='stylesheet' type='text/css'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords" content="Agro Agency 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>
<script src="js/jquery.min.js"> </script>
<!---- 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},900);
});
});
</script>
<!---- start-smoth-scrolling---->
<!----//requred-js-files---->
<script type="text/javascript" src="js/jquery.smint.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('.subMenu').smint({
'scrollSpeed' : 1000
});
});
</script>
</head>
<body>
<!--body-->
<div id="home" class="banner">
<div class="container">
<div class="banner-info">
<div class="logo">
<a href="index.html"><img src="images/logo.png" alt=""/></a>
</div>
<h1>Agency of Agriculture</h1>
<p>Agricultural practices such as irrigation and the domestication of livestock were developed long ago great progress in the past century.</p>
<a class="hvr-shutter-out-vertical button" href="#">Learn More</a>
</div>
</div>
</div>
<!---->
<div class="navigation">
<div class="container">
<div class="fixed-header">
<div class="top-menu">
<ul>
<li class="active"><a class="scroll" href="#home">HOME</a></li>
<li><a class="scroll" href="#about">ABOUT</a></li>
<li><a class="scroll" href="#gallery">GALLERY</a></li>
<li><a class="scroll" href="#contact">CONTACT</a></li>
</ul>
</div>
<div class="right-msg">
<a class="scroll" href="#contact"><img src="images/contact.png" alt=""/></a>
</div>
<div class="clearfix"></div>
</div>
<script>
$("span.menu").click(function(){
$(".top-menu ul").slideToggle(500, function(){
});
});
</script>
<!-- script for menu -->
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
});
});
</script>
<!-- script for menu -->
<script>
$(document).ready(function() {
var navoffeset=$(".navigation").offset().top;
$(window).scroll(function(){
var scrollpos=$(window).scrollTop();
if(scrollpos >=navoffeset){
$(".navigation").addClass("fixed");
}else{
$(".navigation").removeClass("fixed");
}
});
});
</script>
</div>
</div>
<!---->
<div class="top-grid">
<div class="container">
<div class="top-grid-section">
<div class="col-md-3 top-grids">
<span class="icon1"></span>
<h3>Agriculture Design</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet aliquam erat volutpat.</p>
</div>
<div class="col-md-3 top-grids">
<span class="icon2"></span>
<h3>Seeds Development</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet aliquam erat volutpat.</p>
</div>
<div class="col-md-3 top-grids">
<span class="icon3"></span>
<h3>Corn Seeds</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet aliquam erat volutpat.</p>
</div>
<div class="col-md-3 top-grids">
<span class="icon4"></span>
<h3>Leaf Development</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet aliquam erat volutpat.</p>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<!---->
<div id="about" class="about">
<div class="container">
<div class="col-md-6 about-pic">
<img src="images/trac.jpg" alt=""/>
</div>
<div class="col-md-6 about-info">
<h3>Agriculture Design</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
<a class="hvr-bounce-to-bottom" href="#">Read More</a>
</div>
</div>
</div>
<!----start-portfolio---->
<div id="gallery" class="portfolio section s2">
<div class="container portfolio-head">
<h3> Gallery</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>
<!---- start-portfolio-script----->
<script src="js/hover_pack.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
$('#portfoliolist').mixitup({
targetSelector: '.portfolio',
filterSelector: '.filter',
effects: ['fade'],
easing: 'snap',
// call the hover effect
onMixEnd: filterList.hoverEffect()
});
},
hoverEffect: function () {
// Simple parallax effect
$('#portfoliolist .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>
<!----//End-portfolio-script----->
<ul id="filters" class="clearfix">
<li><span class="filter active" data-filter="app card icon">All</span></li>
<li><span class="filter" data-filter="app">Seeds</span></li>
<li><span class="filter" data-filter="card">Croping</span></li>
<li><span class="filter" data-filter="icon">Development</span></li>
</ul>
<div id="portfoliolist">
<div class="portfolio app mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-strip
农作物种植网站模板_html5 bootstrap 响应式模板UI前端源码.rar
75 浏览量
2023-08-01
14:02:39
上传
评论
收藏 802KB RAR 举报
农作物种植网站模板_html5 bootstrap 响应式模板UI前端源码.rar （30个子文件） 
moban391 js 
bootstrap.min.js 28KB jquery.easing.min.js 5KB jquery.smint.js 4KB hover_pack.js 12KB easing.js 5KB move-top.js 1KB jquery.mixitup.min.js 14KB jquery.min.js 94KB css style.css 17KB bootstrap.min.css 98KB popuo-box.css 5KB bootstrap.css 118KB
index.html 16KB images 
banner.jpg 114KB trac.jpg 94KB
logo.png 4KB p8.jpg 83KB p4.jpg 43KB p6.jpg 50KB link-ico.png 2KB social2.png 6KB contact.png 3KB close.png 1KB p7.jpg 81KB p2.jpg 54KB p3.jpg 129KB icons.png 14KB people.jpg 15KB p5.jpg 65KB p1.jpg 67KB资源评论
