javascript - Make div follow screen wont work -
i trying make text follows screen when u scroll,
i have placed text in div named "mydiv"
<div id="mydiv" > <!-- lots of stuff in asp --> <table> <!-- table rows, etc. --> </table> </div>
the jquery
<script type="text/javascript"src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript"> $(document).ready(function () { var currenttop = parseint($('#mydiv').css('top')); $(window).scroll(function () { var top = $(window).scrolltop(); $('#mydiv').css('top', top+currenttop); }); }); </script>
and css
.mydiv{ position:absolute; top:10px; }
using position: absolute
fixes relative body. want position: fixed
, fixes relative window.
if have content larger size of box, you'll need account overflow
property, have scroll bars on box. user can see of content, though not @ same time of course. css be:
.mydiv { position: fixed; top: 10px overflow: auto; height: 100%; }
you can drop jquery entirely; don't need long have position: fixed
.
note, however, not work mobile browsers, use viewport concept: there view layered on rendered "window" , fixed
element locked window, not viewport. in case, need come javascript solution, though preferably 1 fires if on mobile device.
Comments
Post a Comment