Jquery-gotop NPM

jquery-gotop

goTop is a <2kb Scroll to Top jQuery plugin.

Demo

A live demo is available with documentation.

There are a few easy wasy to get jQuery-goTop.

Download the latest full source code (includes debug and minified versions). zip | tarbar
Clone the entire project or fork your own version.
Install using NuGet

PM> Install-Package jquery-gotop

Install using NPM

npm install jquery-gotop

Install using bower

bower install jquery-gotop

Getting Started

Download the minified version of the plugin and include it after jQuery.
Add the following HTML to the bottom of the body tag:

<div id='goTop'></div>

Add the following JavaScript code:

<script>
   $(function () {
      $('#goTop').goTop();
   });
</script>

Options

Name	Description	Type	Default
container	The HTML element to which the scroll function will be attached. If no value is given, then the scroll function will be attched to the window.	String	""
appear	The amount of pixels the page must be scrolled down before the arrow is displayed.	Integer	200
scrolltime	A number determining how long the animation will run when scrolling to the top of the page.	Integer	800
src	The CSS classes used to display the arrow.	String	fas fa-chevron-up
width	The width of the arrow.	Integer 45
place	The location where the arrow will be shown. Valid values are "right" or "left".	String	"right"
fadein	A number determining how long the animation will run when fading in to opaque.	Integer	500
fadeout	A number determining how long the animation will run when fading out to transparent.	Integer	500
opacity	Sets the transparency level for the arrow, where 1 is not transparent at all, 0.5 is 50% see-through and 0 is completely transparent.	Decimal	0.5
marginX	The percentage amount indicating how far away the arrow is from the bottom, left, or right, depending on the value of place.	Integer	2
marginY	The percentage amount indicating how far away the arrow is from the top or bottom, depending on the value of place.	Integer	2
zIndex	The z-index value.	Integer	9

Example

A more complete example which changes the placement from right to left is:

<script>
   $(function () {
      $('#goTop').goTop({
         "place": "left"
      });
   });
</script>

Bugs and feature requests

Have a bug or a feature request? Please open a new issue. Before opening any issue, please search for existing issues and read the Issue Guidelines, written by Nicolas Gallagher.

Versioning

For transparency and insight into our release cycle, and for striving to maintain backward compatibility, jquery-gotop will be maintained under the Semantic Versioning guidelines as much as possible.

Releases will be numbered with the following format:

<major>.<minor>.<patch>

And constructed with the following guidelines:

Breaking backward compatibility bumps the major (and resets the minor and patch)
New additions without breaking backward compatibility bumps the minor (and resets the patch)
Bug fixes and misc changes bumps the patch

For more information on SemVer, please visit http://semver.org/.

Authors

Scott Dorman

Changes

v2.0.0 (2019-06-24)

Switched from using the Bootstrap 3.x Glyphicons library to Font Awesome Free (version 5 and up) because Bootstrap 4.x no longer supports Glyphicons. (#4)