• 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
  • Adding and Customizing the Background with Phlox Background Settings
  • Customizing Slider Layouts
  • 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

Introducing Phlox
Phlox Code
Customizing Shopping Cart Dropdown Menu
Phlox Accordion
Phlox Divider
Understanding Licenses Information
Phlox Button
Getting Started with Phlox News
Copyright © 2017 Averta. All rights reserved.