Nourishing Pear Medley

    mini-parallax

    0.3.3 • Public • Published

    mini-parallax

    Parallax library contains both normal parallax and background parallax.

    Written in vanilla JavaScript. It's lightweight.

    Demo

    Installation

    ES Modules

    npm

    npm i mini-parallax
    import { NormalParallax, BackgroundParallax } from 'mini-parallax'

    CDN

    unpkg (3.6 KB)

    <script src="https://unpkg.com/mini-parallax"></script>
    const { NormalParallax, BackgroundParallax } = MiniParallax

    MiniParallax is global object containing NormalParallax and BackgroundParallax class.

    Usage

    NormalParallax class

    Docs

    new NormalParallax('.js-parallax', {
      speed: 0.03
    })
    <div class="js-parallax"></div>
     
    <!-- Set speed only for this element -->
    <div class="js-parallax" data-speed="0.05"></div>

    If you disable autoRun, run it at any time you like.

    const parallax = new NormalParallax('.js-parallax', {
      autoRun: false
    })
     
    window.addEventListener('load', () => {
      parallax.run()
    })

    If the text is in the parallax element, it will blur, so set the isRound option to true.

    new NormalParallax('.js-parallax', {
      isRound: true
    })

    BackgroundParallax class

    It automatically calculates the position of the background element from the height of the parent element and the background element.

    Docs

    new BackgroundParallax('.js-background-parallax')
    <div class="parent">
      <div class="js-background-parallax"></div>
    </div>

    Browsers support

    IE / Edge
    IE / Edge
    Firefox
    Firefox
    Chrome
    Chrome
    Safari
    Safari
    iOS Safari
    iOS Safari
    IE11, Edge last version last version last version last version

    If you want more features, please consider other parallax libraries.

    Install

    npm i mini-parallax

    DownloadsWeekly Downloads

    194

    Version

    0.3.3

    License

    MIT

    Unpacked Size

    34.7 kB

    Total Files

    6

    Last publish

    Collaborators

    • ko-yelie