forked from turington/turington.github.io
-
Notifications
You must be signed in to change notification settings - Fork 1
/
check.html
81 lines (71 loc) · 3.8 KB
/
check.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html>
<head>
<style type="text/css">.new-deal{width:100%;float:left;padding:15px 0;}
.new-deal .item-slide{position: relative;overflow: hidden;transition:all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;margin:15px 0;}
.new-deal .slide-hover{ position: absolute;height: 100%;width: 100%;left: -100%; background:rgba(0,0,0,.5);top: 0;transition:all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-moz-border-radius: 5px; border-radius: 5px;-webkit-border-radius: 5px; }
.new-deal .item-slide:hover .slide-hover{left:0px;}
.new-deal img{max-width:100%;}
.text-wrap {position: absolute;bottom: 0;left: 0;width: 100%;color: #fff;background: rgba(0, 0, 0, .5);z-index:999;transition:all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;}
.text-wrap h4{padding:0 5px;}
.box-img{width: 100%; float: left; -moz-border-radius: 5px; border-radius: 5px;-webkit-border-radius: 5px; overflow: hidden; border: 1px solid #ccc;}
.text-wrap .desc{width:50%;float:left;padding:0 5px;}
.text-wrap p{padding: 15px;font-size: 15px;text-align: center;font-weight: normal;text-shadow: 2px 2px 3px #000;}
.text-wrap .desc h4{margin:0px;font: 400 17px/21px "Roboto";}
.text-wrap .desc h3{margin:0px;font: 400 32px/36px "Roboto";}
.new-deal .item-slide:hover .text-wrap{background:none}
.book-now-c {float:right;padding:10px;}
.book-now-c a {background: #029a8b;color: #fff;padding: 5px;border-radius: 5px;margin-top:0px;float: left;min-width: 101px;text-align: center;font-size: 16px;}
.new-deal .item-slide:hover .box-img .text-wrap{bottom:-100%;}</style>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<!--our css files-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>
<script type="text/javascript" src="data.js"></script>
<script type="text/javascript" src="data.js"></script>
<title></title>
<body>
<!------ Include the above in your HEAD tag ---------->
<section class="new-deal">
<div class="container">
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 deal deal-block" id="events">
<div class="item-slide">
<div class="box-img">
<img src="http://orig11.deviantart.net/6356/f/2010/156/e/f/swallowed_by_nature_by_danutza88.jpg" alt="dasdas"/>
<div class="text-wrap">
<h4>Paris europe <span class="deal-data"><span class="glyphicon glyphicon-calendar"></span> Sun, Jan 29 - Tue, Jan 31</span></h4>
<div class="desc">
<span>Starting from</span>
<h3>$1000</h3>
</div>
<div class="book-now-c">
<a href="#">Book Now</a>
</div>
</div>
</div>
<div class="slide-hover">
<div class="text-wrap">
<div id="eventsContainer"></div>
<h4>Paris europe <span class="deal-data"><span class="glyphicon glyphicon-calendar"></span> Sun, Jan 29 - Tue, Jan 31</span></h4>
<div class="desc">
<span>Starting from</span>
<h3>$1000</h3>
</div>
<div class="book-now-c">
<a href="#">Book Now</a>
</div>
</div>
</div>
</div>
</div>
<script>
updateEvents();
</script>
</div>
</section>
</body>
</html>