Kayzen

Scroll Wheel

assets/modules/objects/scroll-wheel

Files

  • _scroll-wheel.scss
  • README.md

Github Page (customers only): https://github.com/esr360/Kayzen/tree/master/assets/modules/objects/scroll-wheel

Module Overview

  • Name: scroll-wheel
  • Modifiers: null
  • Components: null

Examples

<a class="scroll-wheel" href="#key-features"></a>

View Demo

Customizing

The Scroll Wheel can be customized using the following options:

Read the Configuration page to learn more about a module's configuration.

Property Name Default Value Description
size font-size('size-5') This allows the config to be accessed in the JavaScript.
color color('greyscale', 'white') The position on the screen for the scroll-top icon (top, right, bottom, left).
outline-width 0.075em The width at which the icon should be hidden.
animate true If enabled the Scroll Wheel icon will be animated.

To change one of the above values, pass your new value(s) to the scroll-wheel() mixin in your theme file (e.g. assets/themes/Kayzen/_kayzen.scss).

@include scroll-wheel((
    'size'          : 30px,
    'outline-width' : 2px,
    'animate'       : false
));