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] Top Slider


With this extension you can setup a multipurpose layer fixed on top of the page contents, usually for a navigation menu; it smartly opens and closes sliding itself based on the current page position.

Some features:

- RWD support.
- Focusable target object.
- Lean-out (the layer is partially closed).
- Number of pixels to scroll-down/up to close/open the layer.
- Initial number of pixels to scroll-down to close the layer
(when the page is at the beginning of the contents).
- Sliding delay factors to close and open the layer.
- Supports keyboard navigation.
- Crossbrowser, crossplatform and backward compatible.
- Lightweight, does not require jQuery.


HTML 4.01 Transitional
W3C compliant


DEMO


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

* New in version 1.1

- Objects can slide from top (header-like) or from bottom (footer-like) depending on the selected position.
- Minor core tweaks.

* New in version 1.0.0.1

- Improved actions definition on scroll-down/up events.
- Join object: Optionally, sticks an object below the original one, this layer will not be hidden but slides with the main one;
  it is useful for advanced RWD schemes.
- Improved keyboard navigation behavior.



How to use?

1. Design your page/s and its/their contents.
2. Design the layer to be on top of the contents -like a header- as you usually do;
    it may be used as a navigation menu and it can be a layer or a masterobjects (formerly masterpage).
3. Drag and drop the extension.
4. Open the extension dialog box and enter the target object, the layer or the masterpage
    to be converted to a smart sticky layer.
5. Optionally, you can customize the behavior such as speed, required pixels to scroll the
    page to open/close the layer, etc.
6. Preview or publish.

Enjoy!
w3c compliant
© 2012-17 by MAGNA web studio • all rights reserved


new shop with