• 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
  • Displaying Phlox Recent Portfolios by Page Builder
  • 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

Displaying Related Posts on your Blog
Changing Slider Skin
Enabling Keyboard Navigation
Adding Button Layer
Understanding the Bundled Products License Rules
Adding Text Layer
Master Slider visual builder tool
Enabling Wheel Navigation
Copyright © 2017 Averta. All rights reserved.