jquery - How to position an element in the top left corner and make it work as a "to the top" button? -
i'm creating site needs "to top" button , want position in top left corner (like above picture shows). (jekyll) html:
<body> <a name="top"></a> <a href="#top" id="totop">top</a> <header id="head"><span id="ruby">text</span> text</header> <nav><ul>— {% post in site.posts reversed %}{% if post.layout != 'no-title' %} <li><a href="#{{ post.anchor }}">{{ post.title }}</a></li> {% endif %}{% endfor %} —</ul></nav> <section id="content"> {{ content }} </section> <small id="soon">— more content —</small> <footer><!-- content --></footer> <script> <!-- script --> $(document).ready(function(){$("a[href*=#]").click(function(){if(location.pathname.replace(/^\//,"")==this.pathname.replace(/^\//,"")&&location.hostname==this.hostname){var a=$(this.hash);a=a.length&&a||$("[name="+this.hash.slice(1)+"]");if(a.length){var b=a.offset().top;$("html,body").animate({scrolltop:b},1000);return false}}})}); </script> the minified script @ bottom css tricks (smooth scrolling). came with:
a#totop{ position: fixed; top: 5px; left: 5px; text-align: left;} but doesn't give me results want. of site @ this gist.
you try , following:
html:
<body> <a id="top"></a> </body> css:
body { position: relative; } #totop { position: absolute; top: 5px; left: 5px; text-align: left; }
Comments
Post a Comment