JQuery Extension Help - Adding Conditional Statements
<p>Im trying to write a JQuery wrapper extension that takes a content div and then shows it modally.  Im having a bit of trouble getting it to work.  It seems to work when I daisychain everything but when I try to use more than one line I break it.  The problem with daisychaining is I don't know how to get the conditionals in there.</p>

<h2>This doesnt work</h2>

<pre><code>(function ($) {
    $.fn.showAsModal = function () {
        var ret = this.css({ 'position': 'absolute', 'top': '400px', 'left': '100px', 'z-index': '9001' });
        if (this.parent('.modal-container').size() &lt;= 0) ret = this.wrap("&lt;div style=\"display:none;\" class=\"modal-container\"&gt;&lt;/div&gt;");
        if (this.siblings('.modal-mask').size() &lt;= 0) ret.parent().insertAfter("&lt;div style=\"width:" + $(document).width() + "px;height:" + $(document).height() + "px;\" class=\"modal-mask\"&gt;&lt;/div&gt;");
        return ret;
    };
})(jQuery);
</code></pre>

<h2>This does</h2>

<pre><code>(function ($) {
    $.fn.showAsModal = function () {
        return this.css({ "position": "absolute", "top": "400px", "left": "100px", "z-index": "9001" })
        .wrap("&lt;div style=\"display:none;\" class=\"modal-container\"&gt;&lt;/div&gt;")
        .parent().show()
        .append("&lt;div style=\"width:" + $(document).width() + "px;height:" + $(document).height() + "px;\" class=\"modal-mask\"&gt;&lt;/div&gt;")
        .end();
    };
})(jQuery);
</code></pre>

<p>But I don't know how to get conditionals in there...</p>

<p>This is what i want to do:</p>

<h2>Given</h2>

<pre><code>&lt;div id="content"&gt;
    This is a content window
&lt;/div&gt;
</code></pre>

<h2>I want to get</h2>

<pre><code>&lt;div class="modal-container" style=""&gt;
    &lt;div id="content" style="position: absolute; top: 400px; left: 100px; z-index: 9001;"&gt;
        This is a content window
    &lt;/div&gt;
    &lt;div class="modal-mask" style="width: 1680px; height: 897px;"&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>when I do $('#content').showAsModal();</p>
