title: Trying to make ease-in-out-expo timing function using standard css3
body: <p>The standards timing functions of CSS3 don't have ease-in-out-expo.</p>
  
  <p>The standard ease-in-out is <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/timing-function#ease-in-out" rel="nofollow noreferrer">HERE - MDN</a></p>
  
  <p><img src="https://developer.mozilla.org/files/3428/cubic-bezier,ease-in-out.png" alt=""></p>
  
  <p>But I want to make it like easeInOutExpo seen <a href="http://easings.net/#easeInOutExpo" rel="nofollow noreferrer">HERE - easings.net</a></p>
  
  <p><img src="https://img.photobucket.com/albums/v135/noitidart/easingsNet-easeInOutExpo_zps34e47c5f.png" alt=""></p>
  
  <p>I'm real new to timing-function so was struggling mightily with it. Please help.</p>
  
  <p>Edit:
  I found this code in <code>jquery.easing.1.3.js</code> but I don't know how to convert it to <code>cubic-bezier</code>'s four arguments.</p>
  
  <pre><code>easeInOutExpo: function (x, t, b, c, d) {
      if (t==0) return b;
      if (t==d) return b+c;
      if ((t/=d/2) &lt; 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
      return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
  },
  </code></pre>