Question

I have this code below:
And what I need to do is to be able to click on the Div right below and when done the #info_page div would show up in the middle of the screen for a few seconds. Like a dialog but just a simple jquery temp show() with a timer?
Is this possible?

The current code is below.

<div onclick="show_info_box">Click to get message</div>


<div id="info_box" style="display:none">
<span class="custom info">
<img src="info.png" alt="info" height="48" width="48" />
<em>Information</em>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</span>
</div>

Answer 1

You can use jQuery UI (http://jqueryui.com/demos/dialog/) and its dialog to do this, set a timeout once the dialog has been opened to close it:

$(document).ready(function() {
    $("#info_box").dialog({
        autoOpen: false,
        modal: true,
        resizable: false,
        open: function() {
            // close the dialog 10 secs after it's opened
            setTimeout(function() {
                $(this).dialog("close");
            }, 10000);
        }
    });

    // you'll need to set an ID on the DIV that you click
    $("#DIVID").bind("click", function() {
        $("#info_box").dialog("open");
    });
});