Build your website.

Create your dream website with a wide range of components & easy-to-use documentation.

HTML:

          
            <!-- Hero Section -->
            <div class="dzsparallaxer auto-init height-is-based-on-content use-loading mode-scroll" data-options='{direction: "normal"}'>
              <!-- Apply your Parallax background image here -->
              <div class="divimage dzsparallaxer--target gradient-overlay-half-dark-v1 bg-img-hero" style="height: 120%; background-image: url(../../assets/img/1920x1080/img30.jpg);"></div>

              <div class="container position-relative z-index-2 space-2 space-3--md text-center">
                <div class="w-md-75 w-lg-60 mt-lg-9 mx-md-auto">
                  <h1 class="display-3 font-size-48--md-down font-weight-medium text-white mb-3">Build your website.</h1>
                  <p class="lead text-light">Create your dream website with a wide range of components & easy-to-use documentation.</p>
                </div>
              </div>
            </div>
            <!-- End Hero Section -->
          
        

CSS library:

        
          <link rel="stylesheet" href="../../assets/vendor/dzsparallaxer/dzsparallaxer.css">
        
      

JS library and initialization:

        
          <!-- JS Implementing Plugins -->
          <script src="../../assets/vendor/dzsparallaxer/dzsparallaxer.js"></script>