how does jquery fadeIn work? Doing the same with animate()

Question

I love the simple jQuery fadeIn() function, especially because it works without having to set any opacity values to the selector! Just setting it to display:none and using fadeIn() always works.

However I'm not using jQuery for my current project but zepto.js. Zepto only comes with animate() and not with fadeIn().

I wonder how I can create the same behaviour with the animate function! What properties do I have to animate here?

$('#selector').animate({
    display: "block",
    opacity: 1
}, 500, 'ease-out')

Thank you in advance

Answer 1

(function($){
      $.extend($.fn, {
        fadeIn: function(ms){
          if(typeof(ms) === 'undefined'){
            ms = 250;
          }
          $(this).css({
            display: 'block',
            opacity:0
          }).animate({
            opacity: 1
          }, ms);
          return this;
        }
      })
    })(Zepto)

If Zepto works like jQuery $('.example').fadeIn(); should do the trick.

EDIT: Trejder is right, adjusted the parts.