ASP.NET, jQuery UI dialog rendered on page for 1-2 seconds

I have an ASP.NET page where I will check if the user is logged in (by checking the session value) on page load, and if not logged in, it will display the jQueryUI login dialog.

My ASPX page contains these script in the head tag

<style type="text/css">
    body { font-size: 62.5%; }
    label, input { display:block; }
    input.text { margin-bottom:12px; width:95%; padding: .4em; }
    fieldset { padding:0; border:0; margin-top:25px; }
    h1 { font-size: 1.2em; margin: .6em 0; }
    div#users-contain {  width: 350px; margin: 20px 0; }
    div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
    div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
    .ui-button { outline: 0; margin:0; padding: .4em 1em .5em; text-decoration:none;  !important; cursor:pointer; position: relative; text-align: center; }
    .ui-dialog .ui-state-highlight, .ui-dialog .ui-state-error { padding: .3em;  }


</style>
<script type="text/javascript">
$(function() {

    var name = $("#name"),
        email = $("#email"),
        password = $("#password"),
        allFields = $([]).add(name).add(email).add(password),
        tips = $("#validateTips");

    function updateTips(t) {
        tips.text(t).effect("highlight",{},1500);
    }


    function checkRegexp(o,regexp,n) {

        if ( !( regexp.test( o.val() ) ) ) {
            o.addClass('ui-state-error');
            updateTips(n);
            return false;
        } else {
            return true;
        }

    }

    $("#dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 250,
        modal: true,
        buttons: {
                Cancel: function() {
                $(this).dialog('close');
                },                                  
                NewUser: function() {
                 $(this).dialog('close');
                 window.location.href="Register.aspx";
                },
                'Sign in': function() {
                var bValid = true;
                allFields.removeClass('ui-state-error');


                bValid=true;
                isValidationFails=false;
                if (bValid)
                {              
                                        // Go to another page

                    } 
                }
            }
        },
        close: function() {
            allFields.val('').removeClass('ui-state-error');
        }
    });



    $('#create-user').click(function() {
         $(this).dialog('close');
         window.location.href="Register.aspx"
    })
    .hover(
        function(){ 
            $(this).addClass("ui-state-hover"); 
        },
        function(){ 
            $(this).removeClass("ui-state-hover"); 
        }
    ).mousedown(function(){
        $(this).addClass("ui-state-active"); 
    })
    .mouseup(function(){
            $(this).removeClass("ui-state-active");
    });

//});
var isAuthenticated = $("#isAuthenticated").val();
if (isAuthenticated && isAuthenticated == "false")
{
  $("#dialog").dialog("open");
}

      

        
        
        
      

    

});

</script>

      

        
        
        
      

    

Lateral SErver code (in Page_Load)

 if (Session["trCustomerId"] != null)
        {
            Response.Write("Logged in user");
            ClientScript.RegisterHiddenField("isAuthenticated", "true");
        }
        else
        {
            ClientScript.RegisterHiddenField("isAuthenticated", "false");
        }

      

        
        
        
      

    

The program now works fine. But the problem is, when the page is loaded, it shows the UIDialog div for 1-2 seconds on the screen and then disappears. I don't want to show it like that. Can anyone tell me how to solve this?