var $overlay_wrapper;
var $overlay_panel;

var myTimer;

function show_overlay(blnOverlay) {
    if ( !$overlay_wrapper ) append_overlay();
	seconden=31;
	$overlay_wrapper.fadeIn(700, callback_function);
	if (blnOverlay==true){
		myTimer = setInterval('aftellen()',1000);
	}
	else{
	  $('#tellerdiv').css('display', 'none');
	}

}

	var seconden=31;
    function aftellen() {
		seconden=seconden-1;
		if(seconden>=0){
			document.getElementById('teller').innerHTML =   + seconden ;
			}
		else{
			clearInterval(myTimer);
			$overlay_wrapper.fadeOut(500);
		}
     };


var callback_function = function(){
	$(this).delay(30000, function(){
	//clearInterval(myTimer);
	//$overlay_wrapper.fadeOut(500);
	//$('#overlay').css('display', 'none');
	});
}

function hide_overlay() {
	clearInterval(myTimer);
    $overlay_wrapper.fadeOut(500);
}

function hide_overlay2(deze) {
	clearInterval(myTimer);
	$overlay_wrapper.fadeOut(500);
}

function append_overlay() {
    $overlay_wrapper = $('<div id="overlay"></div>').appendTo( $('BODY') );
    $overlay_panel = $('<div id="overlay-panel"></div>').appendTo( $overlay_wrapper );

    //$overlay_panel.html( '<p>This is the overlay content</p><a href="#" class="hide-overlay">Close Overlay</a><p>This is the overlay content</p><a href="http://www.google.nl">http://www.google.nl</a><br>Dit venster sluit automatisch in <span id="teller">5</span> seconden.' );
	$overlay_panel.html(strHTML);

    attach_overlay_events();
}

function attach_overlay_events() {
    $('A.hide-overlay', $overlay_wrapper).click( function(ev) {
        ev.preventDefault();
        hide_overlay();
    });
}

$(function() {
    $('A.show-overlay').click( function(ev) {
        ev.preventDefault();
        show_overlay();
    });
});



