• 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
  • Portfolio MetaData Settings
  • Controlling Slider Height
  • Adding Easing Functions
  • Adding Easing Functions

Adding Easing Functions


Master Slider uses GreenSock animation tool to animate contents. To find the supported animation easing functions, check out?GreenSock Ease Visualizer.

<div id="masterslider" class="master-slider">
      <div class="ms-slide">
        <!-- .... -->
        <div class="ms-layer"
             data-type="text"
             data-offset="{x:100px; y:100px}"
             data-animation-in="{duration:1.3; delay:1; from: true; x:-300px; opacity:0; ease:Quart.easeOut;}"
        >
          Text layer content here...
        </div>
        <!-- .... -->
      </div>
      <!-- .... -->
    </div>

Was this information helpful?

Submit
Previuos Step
Related articles list
Create New Support Ticket

Maybe You're Searching For These

Adding Button Layer
Displaying Related Posts on your Blog
Enabling Keyboard Navigation
Adding Hotspot Layer
Importing Pages and Sections with Phlox Template Kits and Elementor
Creating a simple slider in quick steps
Adding a Scroll to Top Button
Understanding the Bundled Products License Rules
Copyright © 2017 Averta. All rights reserved.