• 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
  • Getting to Know Actions
  • 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

Creating a simple slider in quick steps
Displaying Related Posts on your Blog
Organizing Shop with Product Category and Tag
Organizing Portfolios with Category & Tag
Customizing your Text Content with Phlox Typography Shortcodes
Adding a New Slide to the Slider
Setting a Background Image
Loading Flickr Images
Copyright © 2017 Averta. All rights reserved.