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

Popular posts from this blog

dns - How To Use Custom Nameserver On Free Cloudflare? -

python - Pygame screen.blit not working -

c# - Web API response xml language -