View Offset

object

options.viewOffset expands/contracts the active boundaries of the viewport when calculating element visibility.

Default Value

{
    viewOffset: {
        top: 0,
        right: 0,
        bottom: 0,
        left: 0,
    }
}

Key values should be a number describing distance in pixels.

Usage

A very common use case for options.viewOffest, is adjusting your top boundary by the height of your fixed navigation, e.g:

.top-bar {
    position: fixed;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 60px;
    background: cornflowerblue;
}

ScrollReveal().reveal('.widgets', {
    viewOffset: {
        top: 60
    }
});

This moves the top boundary inwards by 60 pixels, which prevents elements from revealing while obscured from view by our fixed .top-bar example element.