• Home
  • Documentations
    • Phlox WordPress Theme
    • Phlox Pro WordPress Theme
    • Master Slider jQuery
    • Master Slider WordPress Pro
    • Master Slider WordPress Free
    • LOTUS WordPress Theme
  • Video Tutorials
    • Phlox ? Video Tutorials
    • Master Slider WP Pro
    • Master Slider WP Free
    • Master Slider jQuery
    • Lotus ? Video Tutorials
  • FAQ
    • General Questions
    • LOTUS WordPress Theme
    • Master Slider jQuery
    • Master Slider WordPress
    • CUTE Slider
  • Knowledge base
    • Beginners
    • Advanced Techniques
    • WordPress plugins
  • Support Forum
    • Login Or Register
    • Support Forum
    • Support Policy
Averta Support Center
  • Home
  • Documentations
    • Phlox WordPress Theme
    • Phlox Pro WordPress Theme
    • Master Slider jQuery
    • Master Slider WordPress Pro
    • Master Slider WordPress Free
    • LOTUS WordPress Theme
  • Video Tutorials
    • Phlox ? Video Tutorials
    • Master Slider WP Pro
    • Master Slider WP Free
    • Master Slider jQuery
    • Lotus ? Video Tutorials
  • FAQ
    • General Questions
    • LOTUS WordPress Theme
    • Master Slider jQuery
    • Master Slider WordPress
    • CUTE Slider
  • Knowledge base
    • Beginners
    • Advanced Techniques
    • WordPress plugins
  • Support Forum
    • Login Or Register
    • Support Forum
    • Support Policy

Looking for the answer

  • Home
  • Defining Animation for the Layers
  • Creating Custom Loading
  • Creating Custom Loading

Creating Custom Loading


To create a custom loading for the slider, you just need to add its markup as a direct child element of the slider element with ms-loading-container class name. Below you can find an example:

  	<div id="masterslider" class="master-slider">
      <div class="ms-loading-container">
        <img src="../path/to/loading.gif" alt="">
        <!-- or any other form of loading -->
      </div>
      <div class="ms-slide">
        <!-- slide content here -->
      </div>
      <div class="ms-slide">
        <!-- slide content here -->
      </div>
      <div class="ms-slide">
        <!-- slide content here -->
      </div>
    </div>

Was this information helpful?

Submit
Previuos Step
Related articles list
Create New Support Ticket

Maybe You're Searching For These

Organizing Blog with Category and Tag
Adding Hotspot Layer
Organizing News with Category and Tag
Understanding Licenses Information
Importing Pages and Sections with Phlox Template Kits and Elementor
Upgrading from Phlox Free to Phlox Pro
Phlox Recent Products Element
Enabling Keyboard Navigation
Copyright © 2017 Averta. All rights reserved.