Skip to content

Instantly share code, notes, and snippets.

@yura20066

yura20066/gist:871cf6789fddc4493b1ea8ae52a39c9e

Created May 27, 2017 19:26
Show Gist options
  • Save yura20066/871cf6789fddc4493b1ea8ae52a39c9e to your computer and use it in GitHub Desktop.
Save yura20066/871cf6789fddc4493b1ea8ae52a39c9e to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
<!doctype html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="style/main.css">
<link rel="shortcut icon" href="../favicon.ico">
<link rel="stylesheet" type="text/css" href="node_modules/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="css/menu.css" />
<link rel="stylesheet" type="text/css" href="css/slider.css" />
<link rel="stylesheet" type="text/css" href="css/plumb.css"/>
<link rel="stylesheet" type="text/css" href="css/overlayBlocks.css" />
<link rel="stylesheet" type="text/css" href="css/chat.css" />
<noscript>
<link rel="stylesheet" type="text/css" href="css/noscript.css" />
</noscript>
<script src="js/snap.svg-min.js"></script>
<link data-require="bootstrap-css@3.2.0" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/bootstrap.css">
</head>
<body>
<div class="wrapp">
<div class="box1">
<div id="slider">
<div id="ei-slider" class="ei-slider">
<ul class="ei-slider-large">
<li>
<img src="images/large/6.jpg" alt="image06" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/1.jpg" alt="image01" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/2.jpg" alt="image02" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/3.jpg" alt="image03" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/4.jpg" alt="image04" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/5.jpg" alt="image05" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
<li>
<img src="images/large/7.jpg" alt="image07" />
<div class="ei-title">
<h2>Creative</h2>
<h3>Creative</h3>
</div>
</li>
</ul>
<!-- ei-slider-large -->
<ul class="ei-slider-thumbs">
<li class="ei-slider-element">Current</li>
<li><a href="#">Slide 6</a><img src="images/thumbs/6.jpg" alt="thumb06" /></li>
<li><a href="#">Slide 1</a><img src="images/thumbs/1.jpg" alt="thumb01" /></li>
<li><a href="#">Slide 2</a><img src="images/thumbs/2.jpg" alt="thumb02" /></li>
<li><a href="#">Slide 3</a><img src="images/thumbs/3.jpg" alt="thumb03" /></li>
<li><a href="#">Slide 4</a><img src="images/thumbs/4.jpg" alt="thumb04" /></li>
<li><a href="#">Slide 5</a><img src="images/thumbs/5.jpg" alt="thumb05" /></li>
<li><a href="#">Slide 7</a><img src="images/thumbs/5.jpg" alt="thumb07" /></li>
</ul>
<!-- ei-slider-thumbs -->
</div>
</div>
</div>
<!--///////////////////////////////////////////////////-->
<!--//////////////////// Chat ///////////////////-->
<!--///////////////////////////////////////////////////-->
<div class="chat-wrap">
<div class="contact-icon">
<div><span>! לשאול שאלה</span></div>
<img src="http://thomaspodgro.com/crea/akp-demo/img/chat-girl.png" alt="Art Kids Sister">
</div>
</div>
<span class="overlay"></span>
<section class="contactme">
<div id="fancy-inputs">
<form action="#!/contact" method="get">
<img src="http://thomaspodgro.com/crea/akp-demo/img/chat-girl.png" alt="Art Kids Sister">
<p>תמיכה טכנית</p>
<label class="input">
<input class="inputs" type="text" name="nom" required="">
<span><span>שם</span></span>
</label>
<label class="input">
<input class="inputs" type="email" name="mail" required="">
<span><span>Email</span></span>
</label>
<label class="input textarea">
<textarea class="inputs" required=""></textarea>
<span><span>שלך ההודעה</span></span>
</label>
<input type="submit" value="submit" class="btn1 cta">
</form>
</div>
</section>
<!--///////////////////////////////////////////////////-->
<!--//////////////////// Chat ///////////////////-->
<!--///////////////////////////////////////////////////-->
<nav id="menu" class="menu">
<button class="menu__handle"><span>Menu</span></button>
<div class="menu__inner">
<ul>
<li><a href="#!/">Home</a><i class="fa fa-fw fa-home"></i></li>
<li><a href="#!/about">About</a><i class="fa fa-star-o" aria-hidden="true"></i></a>
</li>
</ul>
</div>
<div class="morph-shape" data-morph-open="M300-10c0,0,295,164,295,410c0,232-295,410-295,410" data-morph-close="M300-10C300-10,5,154,5,400c0,232,295,410,295,410">
<svg width="100%" height="100%" viewBox="0 0 600 800" preserveAspectRatio="none">
<path fill="none" d="M300-10c0,0,0,164,0,410c0,232,0,410,0,410" />
</svg>
</div>
</nav>
<ng-view></ng-view>
<hr>
<footer>
</footer>
<!--angular-->
<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-sanitize/angular-sanitize.js"></script>
<script src="node_modules/angular-route/angular-route.js"></script>
<script src="node_modules/angular-google-map/dist/angular-google-map.min.js"></script>
<!--app-->
<script src="app/config.js"></script>
<script src="app/route.js"></script>
<!--controllers-->
<script src="app/controllers/mainCtrl.js"></script>
<script src="app/controllers/plumber.js"></script>
<script src="app/controllers/selectCtrl.js"></script>
<script src="app/controllers/animeCtrl.js"></script>
<script src="app/controllers/contactCtrl.js"></script>
<script src="app/controllers/videoCtrl.js"></script>
<script src="app/controllers/map.js"></script>
<script src="app/controllers/mapCtrl.js"></script>
<script data-require="google-maps@1.0.0" data-semver="1.0.0" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script data-require="angular.js@1.2.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js" data-semver="1.2.17"></script>
<script data-require="lodash-underscore@*" data-semver="2.4.1" src="https://rawgit.com/lodash/lodash/2.4.1/dist/lodash.underscore.min.js"></script>
<script data-require="angular-google-maps@*" data-semver="1.1.4" src="https://rawgit.com/nlaplante/angular-google-maps/1.1.4/dist/angular-google-maps.min.js"></script>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false&language=en"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="app/jqueryApp/jqueryCtrl.js"></script>
<script src="lib/google-maps.js"></script>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<!--Jquery ui-->
<script src="node_modules/jquery-ui/external/jquery/jquery.js"></script>
<script src="node_modules/jquery-ui/jquery-ui.js">
</script>
<script src="js/classie.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.eislideshow.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
$('#ei-slider').eislideshow({
animation: 'center',
autoplay: true,
slideshow_interval: 3000,
titlesFactor: 0
});
});
</script>
<script>
$(document).ready(function() {
//Get the number of items in the gallery
galItems = $('#gallery li').size();
for (i = 0; i < galItems; i++) {
//SET EVENT HANDLERS for each of the gallery items
$('#gallery li:eq(' + i + ')').hover(function() {
ci = $('#gallery li').index(this); //get which li is hovered
//Translate the image inside the list item to the upper and outer regions of the list item view port by moving it on -ve y axis so that it is not visible
$('#gallery li:eq(' + ci + ') img').css('-o-transform', 'translate(0,-320px)');
$('#gallery li:eq(' + ci + ') img').css('-webkit-transform', 'translate(0,-320px)');
$('#gallery li:eq(' + ci + ') img').css('-moz-transform', 'translate(0,-320px)');
$('#gallery li:eq(' + ci + ') img').css('transform', 'translate(0,-320px)');
//Translate the DIV containg the gallery content to the list item view port by moving it on -ve y axis so that it is made visible
$('#gallery li:eq(' + ci + ') div').css('-o-transform', 'translate(0,-315px)');
$('#gallery li:eq(' + ci + ') div').css('-webkit-transform', 'translate(0,-315px)');
$('#gallery li:eq(' + ci + ') div').css('-moz-transform', 'translate(0,-315px)');
$('#gallery li:eq(' + ci + ') div').css('transform', 'translate(0,-315px)');
}, function() {
//Reverse the positions of both the image and DIV on mouse out
$('#gallery li:eq(' + ci + ') img').css('-o-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') img').css('-webkit-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') img').css('-moz-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') img').css('transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') div').css('-o-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') div').css('-webkit-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') div').css('-moz-transform', 'translate(0,0)');
$('#gallery li:eq(' + ci + ') div').css('transform', 'translate(0,0)');
});
}
});
</script>
<!--///////////////////////////////////////////////////-->
<!--//////////////////// Chat ///////////////////-->
<!--///////////////////////////////////////////////////-->
<script>
$('.chat-wrap').click(function(){
$(this).addClass('active');
$('.contactme').addClass('active');
$('.overlay').fadeIn();
});
// overlay escape click
$('.overlay').click(function(){
$('.chat-wrap').removeClass('active');
$('.contactme').removeClass('active');
$('.overlay').fadeOut();
});
// inputs background on blur
$('.inputs').blur(function(){
if($(this).val().length > 0){
$(this).addClass('white');
} else {
$(this).removeClass('white');
}
});
</script>
<!--///////////////////////////////////////////////////-->
<!--//////////////////// Chat ///////////////////-->
<!--///////////////////////////////////////////////////-->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment