Skip to main content

    Navigation

    • Home
    • Drupal.org projects
    • Github projects
    • Some of My Works
    • Links
    • Drupal Association Individual Member
    Powered by Drupal 8
    Home

    Sándor Juhász

    Web Developer

    1. Home
    2. lonalore/parallax_bg

    lonalore/parallax_bg

    Project Link
    https://github.com/lonalore/parallax_bg
    Drupal 8 module - Create a Parallax Background effect on any tagged element
    Parallax Background

    This module is an initial Drupal 8 port of Parallax Background module. See Issue #2861714 on drupal.org.

    This a simple module that allows to set a vertical Parallax effect on the background of any element on the DOM.

    Installation

    • Download jquery.parallax library to /libraries/jquery.parallax/ folder
    • Download jquery.localScroll library and unzip files to /libraries/jquery.localScroll/ folder
    • Download jquery.scrollTo library and unzip files to /libraries/jquery.scrollTo/ folder
    • Finally, install parallax_bg module

    Downloaded libraries should look like this:

    • /libraries/jquery.parallax/jquery.parallax.js
    • /libraries/jquery.localScroll/jquery.localScroll.min.js
    • /libraries/jquery.scrollTo/jquery.scrollTo.min.js

    Configuration

    • Goto Admin / Structure / Parallax elements
    • Add new element you want to apply the Parallax effect using any valid jQuery selector. The selector should point to the element that holds the background, for example: #top-content, body.one-page #super-banner

    CSS Note

    Depending on the position of your element, you need to apply some top-padding to align the background when entering viewport.