Question

I want to use the jQuery show(700) function, but I do not want any opacity changes. The element in question has a background PNG image with alpha transparency, and the opacity change causes strange black borders around the background image during the animation. How can I omit opactiy animation from the show() function?

Answer 1

Use the animate function and simply vary the width and height. Here’s a plugin that will do a reveal.

jQuery.fn.extend( {
    reveal: function() {
       return this.each( function() {
           var $this = $(this);
           $this.animate( { width: "show", height: "show" } );
       });
    }
}