jQuery overlay help - autoclose?

I have a jQuery overlay on my site and I'm trying to get it to autoclose. So far I successfully have it working with a delayed autoopen and a close button. But I want to change it to either:
1. Delayed autoclose of 10 seconds after it opens.
2. After 10 seconds, the close button appears, giving the option for the visitor to close.

This is the codes I have working so far:

jQuery script I'm using:

<script src="http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js"></script>	

Code (markup):

Close button on the overlay:

<button class="close"> Close This Box!</button> 

Code (markup):

Delayed autoopen:

// load it after delay
})

var ol = $("#facebox").overlay({api: true});
  // wait 7 seconds, then load the overlay
  setTimeout(function() {
    ol.load();
  }, 2000);
   
});

Code (markup):

Any help or guidance getting this to work either way would be greatly appreciated!

 

You are using a timer to delay the load of the overlay so just do same to auto close it after 10 sec. Add a settimeout within the load method of the overlay and run the close method there Also you can hide your button on overlay load and then with your timer reveal it after 10 sec. Take a look at the hide and show methods of jquery or fadeIn and fadeOut for a little animation.