Edit in JSFiddle

(function() {
    
$('html').addClass('js');

var contactForm = {

    container: $('#contact'),

    config: {
        effect: 'slideToggle',
        speed: 500
    },

    init: function(config) {
        $.extend(this.config, config);

        $('<button></button>', {
            text: 'Contact Me'
        })
            .insertAfter( 'article:first' )
            .on( 'click', this.show );
    },

    show: function() {
        var cf = contactForm,
            container = cf.container,
            config = cf.config;

        if ( container.is(':hidden') ) {
            contactForm.close.call(container);
            container[config.effect](config.speed);
        }
    },

    close: function() {
        var $this = $(this), // #contact
            config = contactForm.config;

        if ( $this.find('span.close').length ) return;

        $('<span class=close>X</span>')
            .prependTo(this)
            .on('click', function() {
                // this = span
                $this[config.effect](config.speed);
            })
    }
};

contactForm.init({
    // effect: 'fadeToggle',
    speed: 300
});

})();

<article>
    <h1>Click on the "contact me" button</h1>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    </p>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    </p>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    </p>
</article>

<div id="contact">
    <h2>Contact Me</h2>
    <form action="#">
        <ul>
            <li>
                <label for="name">Name: </label>
                 <input name="name" id="name">
            </li>

            <li>
                <label for="email">Email Address: </label>
                 <input name="email" id="email">
            </li>

            <li>
                <label for="comments">What's Up?</label>
                <textarea name="comments" id="comments" cols="30" rows="5"></textarea>
            </li>
            <li>
                <input type="submit" value="Submit">
            </li>
        </ul>
    </form>
</div>