I think you're looking for the .close method - here's how you'd use it, after the user has pushed the button to submit their age:
$('#dialog-modal').dialog('close'); //hides modal, shows content behind
More documentation on jQuery UI dialogs:
http://api.jqueryui.com/dialog/#method-close
EDIT: Here's how you could update your start() method:
start: function() {
this.setUsersBirthday();
if (this.userIsOverMinimumAge()) {
this.setCookie("usersBirthday",this.usersBirthday,30);
$('#dialog-modal').dialog('close');
} else{
this.notMinimumAge();
};
},
And a JSFiddle Demo: http://jsfiddle.net/donmccurdy/czERa/
EDIT #2 - (Responding to OP's question about checking the cookie on every page)
You had a few bugs in the code that checks the cookie. I've updated the JSFiddle, and here's a quick version of what was wrong:
1) Instead of the code you currently have that always shows the dialog, check the cookie first. Like this:
$(function() {
window.ageCheck.checkCookie();
});
2) Update checkCookie() method to show the dialog when necessary:
checkCookie: function () {
var usersBirthday=this.getCookie("usersBirthday");
if (!usersBirthday) {
// unknown age - show dialog.
$( "#dialog-modal" ).dialog({modal: true});
return;
}
this.usersBirthday = new Date(usersBirthday);
if (this.userIsOverMinimumAge()) {
$('#dialog-modal').hide();
// user is > 13, don't show dialog.
} else {
// user is < 13, redirect to another page.
this.notMinimumAge();
}
}
3) You have a bug in your getCookie method, as you were returning "usersBirthday" instead of the birthday itself. Fixed here:
getCookie: function (c_name) {
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
//split on '=', then check cookie
x=ARRcookies[i].split('=');
if (x[0]===c_name){
return unescape(x[1]);
}
}
},