@@ -1,14 +1,16 @@ |
||
1 | 1 |
// get the value of the bottom of the #main element by adding the offset of that element plus its height, set it as a variable |
2 | 2 |
function attachHandler(jQuery) { |
3 |
+ |
|
4 |
+ $('#post-image').css('height', (window.height- 102)); |
|
3 | 5 |
var mainbottom = $('#myCarousel').offset().top + ($('#myCarousel').height()*2)-10; |
4 |
- var about_bottom = $('#post').offset().top + $('#post-image').height() - (screen.height - $('#post-image').height() + 152); |
|
5 |
- var post_bottom = $('.feature-post-text').offset().top + $('.feature-post-text').height() - (screen.height - $('.feature-post-text').height() + 232); |
|
6 |
- |
|
6 |
+ var about_bottom = $('#post').offset().top + $('#post-image').height() - 102; |
|
7 |
+ var post_bottom = $('.feature-post-text').offset().top + $('.feature-post-text').height() -102; |
|
8 |
+ |
|
7 | 9 |
// on scroll, |
8 | 10 |
$(window).on('scroll',function(){ |
9 | 11 |
|
10 | 12 |
// we round here to reduce a little workload |
11 |
- stop = Math.round($(window).scrollTop()); |
|
13 |
+ stop = Math.round($(document).scrollTop()); |
|
12 | 14 |
if (stop > mainbottom) { |
13 | 15 |
$('.navbar-inner').addClass('past-main'); |
14 | 16 |
} else { |
@@ -21,7 +23,7 @@ function attachHandler(jQuery) { |
||
21 | 23 |
$(window).on('scroll',function(){ |
22 | 24 |
|
23 | 25 |
// we round here to reduce a little workload |
24 |
- stop = Math.round($(window).scrollTop()); |
|
26 |
+ stop = Math.round($(document).scrollTop()); |
|
25 | 27 |
if (stop > about_bottom) { |
26 | 28 |
$('#post-image').addClass('affix top-affix '); |
27 | 29 |
} else { |
@@ -34,13 +36,14 @@ function attachHandler(jQuery) { |
||
34 | 36 |
$(window).on('scroll',function(){ |
35 | 37 |
|
36 | 38 |
// we round here to reduce a little workload |
37 |
- stop = Math.round($(window).scrollTop()); |
|
39 |
+ stop = Math.round($(document).scrollTop()); |
|
38 | 40 |
if (stop > post_bottom && stop > about_bottom) { |
39 | 41 |
$('#post-image').removeClass('affix top-affix '); |
40 |
- var textsize = $('.feature-post-text').height() - $('#post-image').height()/2 - 80 |
|
42 |
+ var textsize = $('.feature-post-text').height() - $('#post-image').height()/2 - 80; |
|
41 | 43 |
$('#post-image').css('margin-top', textsize); |
42 | 44 |
} else { |
43 | 45 |
$('#post-image').css('margin-top', '0'); |
46 |
+ $('#post-image').css('top', (($(document).scrollTop() - about_bottom - 102)) * -0.1); |
|
44 | 47 |
} |
45 | 48 |
|
46 | 49 |
}); |
@@ -69,15 +72,11 @@ function attachHandler(jQuery) { |
||
69 | 72 |
}, 1000); |
70 | 73 |
}); |
71 | 74 |
|
72 |
- window.setInterval(function(){ |
|
73 |
- var mainbottom = $('#myCarousel').offset().top + ($('#myCarousel').height()*2)-10; |
|
74 |
- var about_bottom = $('#post').offset().top + $('#post-image').height() - (screen.height - $('#post-image').height() + 152); |
|
75 |
- var post_bottom = $('.feature-post-text').offset().top + $('.feature-post-text').height() - (screen.height - $('.feature-post-text').height() + 232); |
|
76 |
- }, 5000); |
|
77 | 75 |
$( window ).resize(function(){ |
76 |
+ $('#post-image').css('height', (window.height- 102)); |
|
78 | 77 |
var mainbottom = $('#myCarousel').offset().top + ($('#myCarousel').height()*2)-10; |
79 |
- var about_bottom = $('#post').offset().top + $('#post-image').height() - (screen.height - $('#post-image').height() + 152); |
|
80 |
- var post_bottom = $('.feature-post-text').offset().top + $('.feature-post-text').height() - (screen.height - $('.feature-post-text').height() + 232); |
|
78 |
+ var about_bottom = $('#post').offset().top + $('#post-image').height() - 102; |
|
79 |
+ var post_bottom = $('.feature-post-text').offset().top + $('.feature-post-text').height() -102; |
|
81 | 80 |
}); |
82 | 81 |
}; |
83 | 82 |
|
@@ -113,6 +113,11 @@ margin-top: 8px; |
||
113 | 113 |
width: 33%; |
114 | 114 |
} |
115 | 115 |
|
116 |
+.maison { |
|
117 |
+ background-image: url(post_maison.jpg); |
|
118 |
+ background-size: cover; |
|
119 |
+} |
|
120 |
+ |
|
116 | 121 |
.thumb-text { |
117 | 122 |
text-transform: uppercase; |
118 | 123 |
color: white; |
@@ -43,11 +43,13 @@ |
||
43 | 43 |
</div> |
44 | 44 |
<div style="margin-top: 50px;"></div> |
45 | 45 |
|
46 |
+ |
|
46 | 47 |
<div id="design" class="thumb"><div class="thumb-text">Design</div></div> |
47 | 48 |
<div id="agencia" class="thumb"><div class="thumb-text">Agência</div></div> |
48 |
- <div id="editora" class="thumb"><div class="thumb-text">Editora</div></div> |
|
49 |
+ <div id="editora" class="thumb"><div class="thumb-text">Editora</div></div> |
|
49 | 50 |
|
50 | 51 |
|
52 |
+<div class="clearfix"></div> |
|
51 | 53 |
|
52 | 54 |
|
53 | 55 |
<div id="about2" class="container"> |
@@ -65,8 +67,8 @@ |
||
65 | 67 |
</div> |
66 | 68 |
|
67 | 69 |
<div id="post" style="margin-top: 80px; " class=""> |
68 |
- <div id="post-image" class="pull-left" style="width: 50%; height: 1000px; overflow: hide;"> |
|
69 |
- <%= image_tag "post_maison.jpg", style: 'width: 100%; max-height: 1000px;'%> |
|
70 |
+ <div id="post-image" class="maison pull-left" style="width: 50%; height: 1000px; overflow: hide;"> |
|
71 |
+ |
|
70 | 72 |
</div> |
71 | 73 |
<div class="pull-right" style="width: 50%; background-color: #F7F7F7;"> |
72 | 74 |
<div style="padding: 50px; padding-top: 20px; width: 70%"> |