summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorryderr <r@okfoc.us>2014-10-24 14:25:39 -0400
committerryderr <r@okfoc.us>2014-10-24 14:25:39 -0400
commit30dac4509e28f07bacf29c3be3d58f8fa684b115 (patch)
tree7ac9b726e3eafa020f8eae735f63aac6d63771f4
parentb54fe490581ad00040910a7552f2bf5ae170cc46 (diff)
adding video
-rw-r--r--public/assets/javascripts/app.js8
-rwxr-xr-xpublic/assets/stylesheets/app.css34
-rwxr-xr-xviews/home.ejs5
3 files changed, 47 insertions, 0 deletions
diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js
index 9b46a3e..f26a782 100644
--- a/public/assets/javascripts/app.js
+++ b/public/assets/javascripts/app.js
@@ -17,6 +17,14 @@ else {
new WOW().init();
+$('.hero .circle').click( function(){
+ $('.videoModal').addClass('active');
+});
+
+$('.videoModal .ion-ios7-close-empty').click( function(){
+ $('.videoModal').removeClass('active');
+});
+
var scene, cam, map;
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index 20498c0..4544fa3 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -92,6 +92,40 @@ a{
text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
}
+.videoModal {
+ position: fixed;
+ width: 0;
+ height: 0;
+ background: rgba(255,255,255,0);
+ display: table;
+ opacity:0;
+ z-index: -1;
+ -webkit-transition:0.4s background
+ -moz-transition:0.4s background;
+ transition:0.4s background;
+}
+
+.videoModal.active {
+ opacity:1;
+ z-index: 6;
+ width: 100%;
+ height: 100%;
+ background: rgba(255,255,255,0.9);
+}
+
+.videoModal .ion-ios7-close-empty {
+ position: absolute;
+ right: 50px;
+ top: 60px;
+ font-size: 80px;
+ cursor:pointer;
+ color:#444;
+}
+
+.videoModal .ion-ios7-close-empty:hover {
+ color:black;
+}
+
#help-button {
display: none;
border-right:0px!important;
diff --git a/views/home.ejs b/views/home.ejs
index 85d6f23..7fe0c71 100755
--- a/views/home.ejs
+++ b/views/home.ejs
@@ -71,6 +71,11 @@
[[ include partials/footer ]]
</div>
+<div class="videoModal">
+<span class="ion-ios7-close-empty"></span>
+<div class="holder">
+<div class="video" style="width: 960px; margin: 0 auto; height: 540px; overflow: hidden; position: relative;"><iframe frameborder="0" scrolling="no" seamless="seamless" webkitallowfullscreen="webkitAllowFullScreen" mozallowfullscreen="mozallowfullscreen" allowfullscreen="allowfullscreen" id="okplayer" src="http://player.vimeo.com/video/109947131?api=1&amp;js_api=1&amp;title=0&amp;byline=0&amp;portrait=0&amp;playbar=0&amp;player_id=okplayer&amp;loop=1&amp;autoplay=0" width="960" height="540" style="width: 960px; height: 540px;"></iframe></div>
+</div>
</body>
[[ include partials/scripts ]]
</html>