javascript - Bootstrap affix-top div overlapping footer -
i have basic bootstrap webpage fixed-top navbar, banner, standard layout body content , footer height of 502px.
with data-offset-top="350"
attribute added, sidebar overlaps footer when reach end of page.
so in order prevent that, added offset-bottom
attribute specify fixing div 502px bottom once page reaches footer.
for sidebar, added proper affix attributes follows:
<div class="sidebar" data-spy="affix" data-offset-top="350" data-offset-bottom="502"> <--sidebar content--> </div>
and css, added this:
.affix-bottom { position:absolute; } .sidebar.affix { position: fixed; top:52px; }
but moment scrolled past banner, sidebar disappear screen leaving white gap on side.
this first time i'm using both affix-top
, affix-bottom
on same element think might going @ wrong way. can please me out this?
link demo page i'm working on: http://demo.shillongtitude.com/biswa/demo1/product.html
Comments
Post a Comment