fix layer display issue
Showing
1 changed file
with
44 additions
and
1 deletions
@@ -9,7 +9,10 @@ var $searchBox = $('.search-box'), | @@ -9,7 +9,10 @@ var $searchBox = $('.search-box'), | ||
9 | $box = $('.box'), | 9 | $box = $('.box'), |
10 | $indexSearch = $('.index-search'), | 10 | $indexSearch = $('.index-search'), |
11 | $indexLogo = $('.index-logo'), | 11 | $indexLogo = $('.index-logo'), |
12 | - $channelLink = $('.index-channel a'); | 12 | + $channelLink = $('.index-channel a'), |
13 | + $win = $(window), | ||
14 | + $doc = $(document), | ||
15 | + $appFloatLayer = $('#float-layer-app'); | ||
13 | 16 | ||
14 | var $search = $searchBox.children('input[type="text"]'), | 17 | var $search = $searchBox.children('input[type="text"]'), |
15 | $cancelSearch = $box.children('.no-search'), | 18 | $cancelSearch = $box.children('.no-search'), |
@@ -65,3 +68,43 @@ $channelLink.on('touchstart', function() { | @@ -65,3 +68,43 @@ $channelLink.on('touchstart', function() { | ||
65 | borderColor: '#fff' | 68 | borderColor: '#fff' |
66 | }); | 69 | }); |
67 | }); | 70 | }); |
71 | +var removeAppFloatLayerFixed = (function() { | ||
72 | + var init = false; | ||
73 | + return function() { | ||
74 | + var winHeight = window.innerHeight; | ||
75 | + var bodyHeight = $doc.height(); | ||
76 | + var scrollTopPosition = $win.scrollTop(); | ||
77 | + var layerHeight = $appFloatLayer.height(); | ||
78 | + var layerPaddingTop = parseInt($appFloatLayer.css('padding-top')); | ||
79 | + var layerPaddingBottom = parseInt($appFloatLayer.css('padding-bottom')); | ||
80 | + var newPosition; | ||
81 | + if(init){ | ||
82 | + newPosition = bodyHeight - winHeight- scrollTopPosition; | ||
83 | + }else{ | ||
84 | + init = true; | ||
85 | + newPosition = bodyHeight - winHeight - scrollTopPosition + layerHeight + layerPaddingTop + layerPaddingBottom; | ||
86 | + } | ||
87 | + $appFloatLayer.css({ | ||
88 | + 'position': 'relative', | ||
89 | + 'bottom': newPosition + 'px' | ||
90 | + }); | ||
91 | + }; | ||
92 | +})(); | ||
93 | + | ||
94 | +$win.scroll(function() { | ||
95 | + | ||
96 | + clearTimeout($.data(this, 'scrollTimer')); | ||
97 | + $.data(this, 'scrollTimer', setTimeout(function() { | ||
98 | + removeAppFloatLayerFixed(); | ||
99 | + }, 2)); | ||
100 | +}); | ||
101 | + | ||
102 | +$win.on('resize', function(){ | ||
103 | + console.log('resize'); | ||
104 | +}); | ||
105 | + | ||
106 | +$win.on('scrollstop', function(){ | ||
107 | + console.log('stop'); | ||
108 | +}); | ||
109 | + | ||
110 | +$doc.on('ready', removeAppFloatLayerFixed); |
-
Please register or login to post a comment