1
Fork 0

Add wow scrolling animation triggers

This commit is contained in:
Jake Howard 2016-05-16 22:29:34 +01:00
parent b911cccd99
commit b61537480f
3 changed files with 10 additions and 11 deletions

View file

@ -65,28 +65,28 @@
<div class="row"> <div class="row">
<div class="col-lg-3 col-md-6 text-center"> <div class="col-lg-3 col-md-6 text-center">
<div class="service-box"> <div class="service-box">
<i class="fa fa-4x fa-server wow bounceIn text-primary" data-wow-delay=".2s"></i> <i class="fa fa-4x fa-server wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Server</h3> <h3>Server</h3>
<p>Designing and building high-performance server applications and environments</p> <p>Designing and building high-performance server applications and environments</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6 text-center"> <div class="col-lg-3 col-md-6 text-center">
<div class="service-box"> <div class="service-box">
<i class="fa fa-4x fa-internet-explorer wow bounceIn text-primary" data-wow-delay=".2s"></i> <i class="fa fa-4x fa-internet-explorer wow bounceIn text-primary" data-wow-delay=".5s"></i>
<h3>Client</h3> <h3>Client</h3>
<p>Creating functional, fast, and mobile-friendly websites</p> <p>Creating functional, fast, and mobile-friendly websites</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6 text-center"> <div class="col-lg-3 col-md-6 text-center">
<div class="service-box"> <div class="service-box">
<i class="fa fa-4x fa-mobile wow bounceIn text-primary" data-wow-delay=".2s"></i> <i class="fa fa-4x fa-mobile wow bounceIn text-primary" data-wow-delay=".7s"></i>
<h3>Mobile</h3> <h3>Mobile</h3>
<p>Building lightweight, cross-platform mobile applications</p> <p>Building lightweight, cross-platform mobile applications</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6 text-center"> <div class="col-lg-3 col-md-6 text-center">
<div class="service-box"> <div class="service-box">
<i class="fa fa-4x fa-usb wow bounceIn text-primary" data-wow-delay=".2s"></i> <i class="fa fa-4x fa-usb wow bounceIn text-primary" data-wow-delay=".9s"></i>
<h3>Hardware</h3> <h3>Hardware</h3>
<p>Constructing workflow-specific Desktops, Servers and Notebooks</p> <p>Constructing workflow-specific Desktops, Servers and Notebooks</p>
</div> </div>
@ -107,7 +107,6 @@
<div class="row no-gutter"> <div class="row no-gutter">
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/1.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">
@ -122,7 +121,6 @@
</div> </div>
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/2.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">
@ -137,7 +135,6 @@
</div> </div>
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/3.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">
@ -152,7 +149,6 @@
</div> </div>
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/4.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">
@ -167,7 +163,6 @@
</div> </div>
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/5.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">
@ -182,7 +177,6 @@
</div> </div>
<div class="col-lg-4 col-sm-6"> <div class="col-lg-4 col-sm-6">
<a href="#" class="portfolio-box"> <a href="#" class="portfolio-box">
<img src="/portfolio/6.jpg" class="img-responsive" alt="">
<div class="portfolio-box-caption"> <div class="portfolio-box-caption">
<div class="portfolio-box-caption-content"> <div class="portfolio-box-caption-content">
<div class="project-category"> <div class="project-category">

View file

@ -22,7 +22,8 @@
"font-awesome": "=4.6.1", "font-awesome": "=4.6.1",
"jquery": "=2.2.3", "jquery": "=2.2.3",
"jquery.easing": "=1.3.2", "jquery.easing": "=1.3.2",
"underscore": "=1.8.3" "underscore": "=1.8.3",
"wow.js": "=1.2.0"
}, },
"devDependencies": { "devDependencies": {
"autoprefixer": "=6.3.6", "autoprefixer": "=6.3.6",

View file

@ -1,3 +1,7 @@
import 'jquery.easing'; import 'jquery.easing';
import './jquery.fittext'; import './jquery.fittext';
import './creative'; import './creative';
import WOW from 'wow.js';
new WOW().init();