Fixing Bootstrap Affix to near standing column -
appreciate if can me. have several bootstrap rows, , 1 of them contain 2 columns - left scrollable text, , right description fixed affix. right column must shown when scroll down top of left column , hide when left column over. tried make work way, didn't work out. affix fixed body (and not top , bottom borders of parent block wanted). doing wrong? (except me speaking english :) )
index.html:
... <body data-spy="scroll"> ... <div class="chapter"> <div class="row" data-target="#myscrollspy"> <div class="col-md-5" > precious scrollable text </div> <div class="col-md-6" id="myscrollspy"> <div id="myaffix"> not working affix </div> </div> </div> </div> ... <script> $('#myaffix').affix({ offset: { top: 100, bottom: 100 } }); </script> ... </body>
style.css:
body { position: relative; } .affix { top: 150px; width: 80%; } @media (min-width: 1200px) { .affix { } } .affix-bottom { position: absolute; } @media (min-width: 1200px) { .affix-bottom { } }
well, turns out better decision forget affix , use stickyfill - https://github.com/wilddeer/stickyfill
Comments
Post a Comment