universal 0.1.4 → 0.1.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_includes/banner.html +3 -0
- data/_includes/footer.html +40 -5
- data/_includes/get.it.html +30 -18
- data/_includes/{header.html → header.prod.html} +0 -0
- data/_includes/header.sales.html +90 -0
- data/_includes/js.html +0 -3
- data/_includes/map.html +19 -0
- data/_layouts/default.html +2 -1
- data/_layouts/prod.html +2 -1
- data/assets/img/Chewbacca.jpg +0 -0
- data/assets/img/Georges.jpg +0 -0
- data/assets/img/Han_20Solo.jpg +0 -0
- data/assets/img/Jean.jpg +0 -0
- data/assets/img/Lionel.jpg +0 -0
- data/assets/img/Luke_20Skywalker.jpg +0 -0
- data/assets/img/customer-vanek.png +0 -0
- data/assets/img/fixed-background-1.jpg +0 -0
- data/assets/img/fixed-background-2.jpg +0 -0
- data/assets/img/logo-small.png +0 -0
- data/assets/img/logo.png +0 -0
- data/assets/img/texture-bw.png +0 -0
- data/assets/js/stripe.form-v2.js +11 -3
- metadata +7 -4
- data/assets/js/jquery.parallax-1.1.3.js +0 -69
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: b9e84618db35a4c7afaa2b5054d18ee133aaa037d4a67d498c7256092a7a6b69
|
|
4
|
+
data.tar.gz: a977e1c3fa0676907a079e3f82348d4e0353cbd5e9ccec232df73d9a6304a535
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: bf46a85e65450e942ffb787ce2dc5275d3beac0bc8946c79012cbaccdf30d612de5e1f069bbd3deba2f66cf03c66ad076e426fc43f10bfad526a7051a7f4842d
|
|
7
|
+
data.tar.gz: 91c60c0c4ff3c2fa64aa3ed733c2525bd8ea62e961a201078187eeb0c3392e832a57755be22b35b86c806ca05cd5ac861b2f5ce38765a5cf1f85f6e8c326ff1c
|
data/_includes/banner.html
CHANGED
data/_includes/footer.html
CHANGED
|
@@ -7,7 +7,6 @@
|
|
|
7
7
|
<p>{{ site.description }}</p>
|
|
8
8
|
|
|
9
9
|
<hr>
|
|
10
|
-
<hr class="hidden-md hidden-lg hidden-sm">
|
|
11
10
|
|
|
12
11
|
</div>
|
|
13
12
|
<!-- /.col-md-3 -->
|
|
@@ -26,10 +25,46 @@
|
|
|
26
25
|
</div>
|
|
27
26
|
<!-- /.col-md-3 -->
|
|
28
27
|
|
|
29
|
-
<div class="col-md-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
28
|
+
<div class="col-md-6 col-sm-12">
|
|
29
|
+
<form action="https://formspree.io/{{ site.email }}"method="POST">
|
|
30
|
+
<div class="row">
|
|
31
|
+
<div class="col-md-6">
|
|
32
|
+
<div class="form-group">
|
|
33
|
+
<input type="text" class="form-control" placeholder="Votre nom" name="name">
|
|
34
|
+
</div>
|
|
35
|
+
</div>
|
|
36
|
+
<div class="col-md-6">
|
|
37
|
+
<div class="form-group">
|
|
38
|
+
<input type="email" class="form-control" placeholder="Votre email" name="_replyto">
|
|
39
|
+
</div>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
<div class="row">
|
|
43
|
+
<div class="col-md-12">
|
|
44
|
+
<div class="form-group">
|
|
45
|
+
<input type="text" class="form-control" placeholder="Quel est l'objet de votre message ?" name="object">
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
</div>
|
|
49
|
+
<div class="row">
|
|
50
|
+
<div class="col-md-12">
|
|
51
|
+
<div class="form-group">
|
|
52
|
+
<textarea class="form-control" placeholder="Décrivez votre demande" name="message"></textarea>
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
<div class="col-md-12">
|
|
56
|
+
<input type="text" name="_gotcha" style="display:none" />
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
<div class="row">
|
|
60
|
+
<div class="col-md-12">
|
|
61
|
+
<div class="form-group">
|
|
62
|
+
<input type="submit" class="btn btn-template-main" value="Envoyer">
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
</div>
|
|
66
|
+
</form>
|
|
67
|
+
</div>
|
|
33
68
|
</div>
|
|
34
69
|
<!-- /.col-md-3 -->
|
|
35
70
|
|
data/_includes/get.it.html
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
<h3>Vous voulez ce site pour vous ?</h3>
|
|
8
8
|
</div>
|
|
9
9
|
<div class="col-md-4 col-sm-12">
|
|
10
|
-
<button class="btn btn-lg btn-warning" data-parent="#accordionThree" data-toggle="collapse" href="#collapse3a"> Commandez !</button>
|
|
10
|
+
<button class="btn btn-lg btn-warning" data-parent="#accordionThree" data-toggle="collapse" href="#collapse3a" id="order"> Commandez !</button>
|
|
11
11
|
</div>
|
|
12
12
|
</div>
|
|
13
13
|
</div>
|
|
@@ -16,15 +16,15 @@
|
|
|
16
16
|
<div class="panel panel-default">
|
|
17
17
|
<div id="collapse3a" class="panel-collapse collapse">
|
|
18
18
|
<div class="panel-body">
|
|
19
|
-
|
|
20
|
-
<script src="
|
|
21
|
-
<
|
|
19
|
+
|
|
20
|
+
<script src="https://drrjhlchpvi7e.cloudfront.net/libs/stamplay-js-sdk/2.1.4/stamplay.min.js"></script>
|
|
21
|
+
<div class="row">
|
|
22
22
|
<div class="col-md-9 clearfix" id="checkout">
|
|
23
23
|
|
|
24
24
|
<div class="box">
|
|
25
25
|
<form id="payment-form">
|
|
26
26
|
<input type="hidden" name="token" />
|
|
27
|
-
<input type="hidden" id="
|
|
27
|
+
<input type="hidden" id="company" value="{{ site.companyId }}" />
|
|
28
28
|
<div class="row">
|
|
29
29
|
<div class="col-sm-6">
|
|
30
30
|
<div class="form-group">
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
<div class="col-sm-6">
|
|
52
52
|
<div class="form-group">
|
|
53
53
|
<label for="street">Email</label>
|
|
54
|
-
<input type="
|
|
54
|
+
<input type="email" class="form-control" id="email">
|
|
55
55
|
</div>
|
|
56
56
|
</div>
|
|
57
57
|
</div>
|
|
@@ -86,14 +86,14 @@
|
|
|
86
86
|
</div>
|
|
87
87
|
</div>
|
|
88
88
|
<div class="row">
|
|
89
|
-
<div class="col-sm-
|
|
89
|
+
<div class="col-sm-9">
|
|
90
90
|
<div>
|
|
91
|
-
<input type="checkbox" id="hosting" checked>
|
|
92
|
-
<label for="hosting"> Hébergement (Gratuit la première année)</label>
|
|
93
|
-
<br>
|
|
91
|
+
<input type="checkbox" id="hosting" checked onclick="hostingshow()">
|
|
92
|
+
<label for="hosting"> Hébergement (Gratuit la première année, 10,00€ HT/mois ensuite)</label>
|
|
94
93
|
</div>
|
|
95
94
|
</div>
|
|
96
95
|
</div>
|
|
96
|
+
<br>
|
|
97
97
|
<div class="row">
|
|
98
98
|
<div class="col-sm-12">
|
|
99
99
|
<div class="form-group">
|
|
@@ -112,13 +112,7 @@
|
|
|
112
112
|
</div>
|
|
113
113
|
</div>
|
|
114
114
|
</div>
|
|
115
|
-
|
|
116
|
-
<div class="outcome">
|
|
117
|
-
<div class="error"></div>
|
|
118
|
-
<div class="success">
|
|
119
|
-
Success! Your Stripe token is <span class="token"></span>
|
|
120
|
-
</div>
|
|
121
|
-
</div>
|
|
115
|
+
|
|
122
116
|
</form>
|
|
123
117
|
</div>
|
|
124
118
|
|
|
@@ -143,7 +137,7 @@
|
|
|
143
137
|
<td>Création du site</td>
|
|
144
138
|
<th>400.00€</th>
|
|
145
139
|
</tr>
|
|
146
|
-
<tr id="hostingrecap">
|
|
140
|
+
<tr id="hostingrecap" style="display:">
|
|
147
141
|
<td>Hébergement</td>
|
|
148
142
|
<th>Offert la première année</th>
|
|
149
143
|
</tr>
|
|
@@ -166,8 +160,23 @@
|
|
|
166
160
|
</div>
|
|
167
161
|
|
|
168
162
|
</div>
|
|
163
|
+
|
|
169
164
|
<!-- /.col-md-3 -->
|
|
165
|
+
<div class="col-md-12 clearfix">
|
|
166
|
+
<button class="btn btn-template-main" type="submit">Je règle ma commande</button>
|
|
167
|
+
</div>
|
|
168
|
+
</div>
|
|
169
|
+
<br>
|
|
170
|
+
<div class="row" style="display:none">
|
|
171
|
+
<div class="col-md-12">
|
|
172
|
+
<div class="alert alert-success" role="alert" id="success">Félicitations ! Vous recevrez un email de confirmation dans quelques minutes, ainsi qu'un formulaire vous permettant de personnaliser les informations de votre site.</div>
|
|
173
|
+
<div class="alert alert-danger" role="alert" id="fail">Aie ! Une erreur est survenue pendant votre achat, vous n'avez pas été débité.</div>
|
|
174
|
+
</div>
|
|
175
|
+
</div>
|
|
170
176
|
</div>
|
|
177
|
+
<div class="row">
|
|
178
|
+
|
|
179
|
+
</div>
|
|
171
180
|
</div>
|
|
172
181
|
</div>
|
|
173
182
|
|
|
@@ -175,4 +184,7 @@
|
|
|
175
184
|
</div>
|
|
176
185
|
</div>
|
|
177
186
|
</div>
|
|
187
|
+
<!-- stripe form -->
|
|
188
|
+
<script src="https://js.stripe.com/v3/"></script>
|
|
189
|
+
<script src="assets/js/stripe.form-v2.js"></script>
|
|
178
190
|
</section>
|
|
File without changes
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
<header>
|
|
2
|
+
|
|
3
|
+
<!-- *** TOP ***
|
|
4
|
+
_________________________________________________________ -->
|
|
5
|
+
<div id="top">
|
|
6
|
+
<div class="container">
|
|
7
|
+
<div class="row">
|
|
8
|
+
<div class="col-xs-5 contact">
|
|
9
|
+
<p class="hidden-sm hidden-xs">Contactez nous au {{ site.phone }} ou à {{ site.email }}.</p>
|
|
10
|
+
<p class="hidden-md hidden-lg"><a href="'tel:'{{ site.phonelink }}" data-animate-hover="pulse"><i class="fa fa-phone"></i></a> <a href="'mailto:'{{ site.email }}" data-animate-hover="pulse"><i class="fa fa-envelope"></i></a>
|
|
11
|
+
</p>
|
|
12
|
+
</div>
|
|
13
|
+
<div class="col-xs-7">
|
|
14
|
+
<div class="social">
|
|
15
|
+
{% for social in site.social %}
|
|
16
|
+
<a href="{{ social.url }}" class="external {{ social.title }}" data-animate-hover="pulse"><i class="fa fa-{{ social.title }}"></i></a>
|
|
17
|
+
{% endfor %}
|
|
18
|
+
<a href="'mailto:'{{ site.email }}" class="email" data-animate-hover="pulse"><i class="fa fa-envelope"></i></a>
|
|
19
|
+
</div>
|
|
20
|
+
</div>
|
|
21
|
+
</div>
|
|
22
|
+
</div>
|
|
23
|
+
</div>
|
|
24
|
+
<!-- *** TOP END *** -->
|
|
25
|
+
<!-- *** NAVBAR ***
|
|
26
|
+
_________________________________________________________ -->
|
|
27
|
+
|
|
28
|
+
<div class="navbar-affixed-top" data-spy="affix" data-offset-top="200">
|
|
29
|
+
|
|
30
|
+
<div class="navbar navbar-default yamm" role="navigation" id="navbar">
|
|
31
|
+
|
|
32
|
+
<div class="container">
|
|
33
|
+
<div class="navbar-header">
|
|
34
|
+
<a class="navbar-brand home" href="#">
|
|
35
|
+
<img src="assets/img/logo.png" alt="logo {{ site.title }}" class="hidden-xs hidden-sm">
|
|
36
|
+
<img src="assets/img/logo-small.png" alt="logo {{ site.title }}" class="visible-xs visible-sm">
|
|
37
|
+
<span class="sr-only">{{ site.title }} - Retourner à l'accueil</span>
|
|
38
|
+
</a>
|
|
39
|
+
<div class="navbar-buttons">
|
|
40
|
+
<button type="button" class="navbar-toggle btn-template-main" data-toggle="collapse" data-target="#navigation">
|
|
41
|
+
<span class="sr-only">Naviguer</span>
|
|
42
|
+
<i class="fa fa-align-justify"></i>
|
|
43
|
+
</button>
|
|
44
|
+
</div>
|
|
45
|
+
</div>
|
|
46
|
+
|
|
47
|
+
<div class="navbar-collapse collapse" id="navigation">
|
|
48
|
+
<ul class="nav navbar-nav navbar-right">
|
|
49
|
+
|
|
50
|
+
<li class="dropdown">
|
|
51
|
+
|
|
52
|
+
<a href="#">Accueil</a>
|
|
53
|
+
|
|
54
|
+
</li>
|
|
55
|
+
|
|
56
|
+
<li class="dropdown">
|
|
57
|
+
|
|
58
|
+
<a href="#offre">Offre</a>
|
|
59
|
+
|
|
60
|
+
</li>
|
|
61
|
+
|
|
62
|
+
<li class="dropdown">
|
|
63
|
+
|
|
64
|
+
<a href="#equipe">Equipe</a>
|
|
65
|
+
|
|
66
|
+
</li>
|
|
67
|
+
|
|
68
|
+
<li class="dropdown">
|
|
69
|
+
|
|
70
|
+
<a href="#footer">Contact</a>
|
|
71
|
+
|
|
72
|
+
</li>
|
|
73
|
+
|
|
74
|
+
</ul>
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
|
+
</div>
|
|
78
|
+
<div id="top">
|
|
79
|
+
<div class="container">
|
|
80
|
+
<div class="row">
|
|
81
|
+
<p class="text-center">
|
|
82
|
+
<a class="btn btn-warning" onclick="document.getElementById('order').click()" href="#get-it">Je veux ce site !</a>
|
|
83
|
+
</p>
|
|
84
|
+
</div>
|
|
85
|
+
</div>
|
|
86
|
+
</div>
|
|
87
|
+
</div>
|
|
88
|
+
|
|
89
|
+
<!-- *** NAVBAR END *** -->
|
|
90
|
+
</header>
|
data/_includes/js.html
CHANGED
|
@@ -8,15 +8,12 @@
|
|
|
8
8
|
<script src="assets/js/jquery.cookie.js"></script>
|
|
9
9
|
<script src="assets/js/waypoints.min.js"></script>
|
|
10
10
|
<script src="assets/js/jquery.counterup.min.js"></script>
|
|
11
|
-
<script src="assets/js/jquery.parallax-1.1.3.js"></script>
|
|
12
11
|
<script src="assets/js/front.js"></script>
|
|
13
12
|
|
|
14
13
|
|
|
15
14
|
<!-- owl carousel -->
|
|
16
15
|
<script src="assets/js/owl.carousel.min.js"></script>
|
|
17
16
|
|
|
18
|
-
<!-- stripe form -->
|
|
19
|
-
<script src="assets/js/stripe.form-v2.js"></script>
|
|
20
17
|
|
|
21
18
|
<script>
|
|
22
19
|
(function(i, s, o, g, r, a, m) {
|
data/_includes/map.html
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
<section id="gmap">
|
|
2
|
+
<div id="map"></div>
|
|
3
|
+
<script>
|
|
4
|
+
function initMap() {
|
|
5
|
+
var bureau = {lat: {{ site.latitude }}, lng: {{ site.longitude }}};
|
|
6
|
+
var map = new google.maps.Map(document.getElementById('map'), {
|
|
7
|
+
zoom: 16,
|
|
8
|
+
center: bureau
|
|
9
|
+
});
|
|
10
|
+
var marker = new google.maps.Marker({
|
|
11
|
+
position: bureau,
|
|
12
|
+
map: map
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
</script>
|
|
16
|
+
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCjZsHtLiY-JYQuRjpJh6sQzxnHJupL3qM&callback=initMap"
|
|
17
|
+
async defer></script>
|
|
18
|
+
</section>
|
|
19
|
+
<!-- /.banner -->
|
data/_layouts/default.html
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
<body>
|
|
6
6
|
<div id="all">
|
|
7
|
-
{% include header.html %}
|
|
7
|
+
{% include header.sales.html %}
|
|
8
8
|
{% include banner.html %}
|
|
9
9
|
{% include offer.html %}
|
|
10
10
|
{% include testimonials.html %}
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
{% include team.html %}
|
|
13
13
|
{% include customers.html %}
|
|
14
14
|
{% include get.it.html %}
|
|
15
|
+
{% include map.html %}
|
|
15
16
|
{% include footer.html %}
|
|
16
17
|
{% include copyright.html %}
|
|
17
18
|
</div>
|
data/_layouts/prod.html
CHANGED
|
@@ -4,13 +4,14 @@
|
|
|
4
4
|
|
|
5
5
|
<body>
|
|
6
6
|
<div id="all">
|
|
7
|
-
{% include header.html %}
|
|
7
|
+
{% include header.prod.html %}
|
|
8
8
|
{% include banner.html %}
|
|
9
9
|
{% include offer.html %}
|
|
10
10
|
{% include testimonials.html %}
|
|
11
11
|
{% include cta.questions.html %}
|
|
12
12
|
{% include team.html %}
|
|
13
13
|
{% include customers.html %}
|
|
14
|
+
{% include map.html %}
|
|
14
15
|
{% include footer.html %}
|
|
15
16
|
{% include copyright.html %}
|
|
16
17
|
</div>
|
data/assets/img/Chewbacca.jpg
CHANGED
|
Binary file
|
data/assets/img/Georges.jpg
CHANGED
|
Binary file
|
|
Binary file
|
data/assets/img/Jean.jpg
CHANGED
|
Binary file
|
data/assets/img/Lionel.jpg
CHANGED
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
data/assets/img/logo-small.png
CHANGED
|
Binary file
|
data/assets/img/logo.png
CHANGED
|
Binary file
|
data/assets/img/texture-bw.png
CHANGED
|
Binary file
|
data/assets/js/stripe.form-v2.js
CHANGED
|
@@ -25,6 +25,16 @@ function generatePassword() {
|
|
|
25
25
|
retVal += charset.charAt(Math.floor(Math.random() * n));
|
|
26
26
|
}
|
|
27
27
|
return retVal;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
function hostingshow() {
|
|
31
|
+
if (document.getElementById('hosting').checked) {
|
|
32
|
+
document.getElementById('hostingrecap').style.display = '';
|
|
33
|
+
}
|
|
34
|
+
else {
|
|
35
|
+
document.getElementById('hostingrecap').style.display = 'none';
|
|
36
|
+
}
|
|
37
|
+
|
|
28
38
|
}
|
|
29
39
|
|
|
30
40
|
function setOutcome(result) {
|
|
@@ -101,9 +111,7 @@ card.on('change', function(event) {
|
|
|
101
111
|
document.querySelector('form').addEventListener('submit', function(e) {
|
|
102
112
|
e.preventDefault();
|
|
103
113
|
var options = {
|
|
104
|
-
|
|
105
|
-
lastname: document.getElementById('lastname').value,
|
|
106
|
-
name: firstname + " " + lastname,
|
|
114
|
+
name: document.getElementById('firstname').value + " " + document.getElementById('lastname').value,
|
|
107
115
|
address_line1: document.getElementById('company').value,
|
|
108
116
|
address_line2: document.getElementById('street').value,
|
|
109
117
|
address_city: document.getElementById('city').value,
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: universal
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.5
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Ondrej Svestka
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2017-12-
|
|
11
|
+
date: 2017-12-04 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|
|
@@ -71,8 +71,10 @@ files:
|
|
|
71
71
|
- _includes/footer.html
|
|
72
72
|
- _includes/get.it.html
|
|
73
73
|
- _includes/head.html
|
|
74
|
-
- _includes/header.html
|
|
74
|
+
- _includes/header.prod.html
|
|
75
|
+
- _includes/header.sales.html
|
|
75
76
|
- _includes/js.html
|
|
77
|
+
- _includes/map.html
|
|
76
78
|
- _includes/offer.html
|
|
77
79
|
- _includes/team.html
|
|
78
80
|
- _includes/testimonials.html
|
|
@@ -98,9 +100,11 @@ files:
|
|
|
98
100
|
- assets/img/Chewbacca.jpg
|
|
99
101
|
- assets/img/Georges.jpg
|
|
100
102
|
- assets/img/Han Solo.jpg
|
|
103
|
+
- assets/img/Han_20Solo.jpg
|
|
101
104
|
- assets/img/Jean.jpg
|
|
102
105
|
- assets/img/Lionel.jpg
|
|
103
106
|
- assets/img/Luke Skywalker.jpg
|
|
107
|
+
- assets/img/Luke_20Skywalker.jpg
|
|
104
108
|
- assets/img/Marie.jpg
|
|
105
109
|
- assets/img/Princesse Leia.jpg
|
|
106
110
|
- assets/img/apple-touch-icon-114x114.png
|
|
@@ -132,7 +136,6 @@ files:
|
|
|
132
136
|
- assets/js/front.js
|
|
133
137
|
- assets/js/jquery.cookie.js
|
|
134
138
|
- assets/js/jquery.counterup.min.js
|
|
135
|
-
- assets/js/jquery.parallax-1.1.3.js
|
|
136
139
|
- assets/js/owl.carousel.min.js
|
|
137
140
|
- assets/js/stripe.checkout.js
|
|
138
141
|
- assets/js/stripe.form-v2.js
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
Plugin: jQuery Parallax
|
|
3
|
-
Version 1.1.3
|
|
4
|
-
Author: Ian Lunn
|
|
5
|
-
Twitter: @IanLunn
|
|
6
|
-
Author URL: http://www.ianlunn.co.uk/
|
|
7
|
-
Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/
|
|
8
|
-
|
|
9
|
-
Dual licensed under the MIT and GPL licenses:
|
|
10
|
-
http://www.opensource.org/licenses/mit-license.php
|
|
11
|
-
http://www.gnu.org/licenses/gpl.html
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
(function( $ ){
|
|
15
|
-
var $window = $(window);
|
|
16
|
-
var windowHeight = $window.height();
|
|
17
|
-
|
|
18
|
-
$window.resize(function () {
|
|
19
|
-
windowHeight = $window.height();
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
$.fn.parallax = function(xpos, speedFactor, outerHeight) {
|
|
23
|
-
var $this = $(this);
|
|
24
|
-
var getHeight;
|
|
25
|
-
var firstTop;
|
|
26
|
-
var paddingTop = 0;
|
|
27
|
-
|
|
28
|
-
//get the starting position of each element to have parallax applied to it
|
|
29
|
-
$this.each(function(){
|
|
30
|
-
firstTop = $this.offset().top;
|
|
31
|
-
});
|
|
32
|
-
|
|
33
|
-
if (outerHeight) {
|
|
34
|
-
getHeight = function(jqo) {
|
|
35
|
-
return jqo.outerHeight(true);
|
|
36
|
-
};
|
|
37
|
-
} else {
|
|
38
|
-
getHeight = function(jqo) {
|
|
39
|
-
return jqo.height();
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
// setup defaults if arguments aren't specified
|
|
44
|
-
if (arguments.length < 1 || xpos === null) xpos = "50%";
|
|
45
|
-
if (arguments.length < 2 || speedFactor === null) speedFactor = 0.1;
|
|
46
|
-
if (arguments.length < 3 || outerHeight === null) outerHeight = true;
|
|
47
|
-
|
|
48
|
-
// function to be called whenever the window is scrolled or resized
|
|
49
|
-
function update(){
|
|
50
|
-
var pos = $window.scrollTop();
|
|
51
|
-
|
|
52
|
-
$this.each(function(){
|
|
53
|
-
var $element = $(this);
|
|
54
|
-
var top = $element.offset().top;
|
|
55
|
-
var height = getHeight($element);
|
|
56
|
-
|
|
57
|
-
// Check if totally above or totally below viewport
|
|
58
|
-
if (top + height < pos || top > pos + windowHeight) {
|
|
59
|
-
return;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
$this.css('backgroundPosition', xpos + " " + Math.round((firstTop - pos) * speedFactor) + "px");
|
|
63
|
-
});
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
$window.bind('scroll', update).resize(update);
|
|
67
|
-
update();
|
|
68
|
-
};
|
|
69
|
-
})(jQuery);
|