magna
Follow @magnawebstudio on Twitter Follow @magnawebstudio on Twitter
Follow /magnawebstudio on LinkedIn Follow /magnawebstudio on LinkedIn
awarded site
BS"D
magna web studio
Contact us! Contact us!
WB-Developers' Corner
WB-Developers' Corner
       [rz] Go Top


The most lightweight jQuery solution for a fixed scroll-page-to-top icon, plus nice effects.

Smooth fade effect when activate or deactivate the go-top icon.
Normal, hover and push images for the go-top icon.
Custom tooltip compatible with the [rz] Tooltip extension.
Selectable positions and offsets fine-tunning.
Selectable 3D push effects on click.
Set up how many scrolled down pixels are required to activate the go-top icon.
Easing effects.
Time control.
Set up the maximum that can scroll to top (top offset!).
Multi-instance: icons can appear at both right and left sides! (or at the all four corners!)


HTML 4.01 Transitional
W3C compliant


DEMO


* Just a brief about some of the changes that were made lately...

* New in version 1.2.1

- Improved "top" parameter for advanced RWD/fluid scenarios (fixed value and new optional object reference).
- Fixed a backward z-order issue on specific schemes.

* New in version 1.2

- Optional release icon from the bottom position.
- Optional reference object (usually a not-fixed footer) for the icon release.
- Added/improved icon positions.
- Added function/s for external access; useful on complex scenarios when a reference object is specified.

* New in version 1.1

- Added "Cycle mode" feature.
- Optional object to be shown during the scroll process.
- Nine predefined positions with customizable horizontal and vertical offsets.
- Adjustable speed for the fade-in and fade-out effects to apply to the object to be shown.
- External library files.

* New in version 1.0.0.4

- Added optional image-size definition to allow a better implementation in Retina-based devices.

* New in version 1.0.0.3

- The button position is not affected in breakpoints.
- Added more 3D push effects.

* New in version 1.0.0.2

- Hover and push icons are optional.
- Fixed an unstable behavior with the [rz] Tooltip extension in wb9+.
- Improved code.

* New in version 1.0.0.1

- Improved startup.
- Less code.
- Push images for better effects as in [rz] Layers II.


How to use?

1. Drag and drop this extension.
2. Add your own images for the icon (or use the provided ones).
3. Customize the behavior or leave it as by default.
4. Publish or preview.

Enjoy!


External access:

-
MyGoTop.checkpos(); recalculates the optimal icon position on complex scenarios when
  a reference object (to release the icon) is specified; just replace 'MyGoTop' with the actual
  instance name.
w3c compliant
© 2012-17 by MAGNA web studio • all rights reserved


new shop with