jQuery(document).ready(function ($) {
    // Preload menu
    var image1 = $('<img />').attr('src', 'images/werk_h.png');
    var image2 = $('<img />').attr('src', 'images/contact_h.png');
    var image3 = $('<img />').attr('src', 'images/about_h.png');
    var image4 = $('<img />').attr('src', 'images/lab_h.png');
    $('body').append("<div class=\"preload\"></div>");
    $('.preload').append(image1);
    $('.preload').append(image2);
    $('.preload').append(image3);
    $('.preload').append(image4);
   
   
   
 // to position #confirmDialogue, we need the window height/width
    var msg = $('#overlay');
    var height = $(window).height();

    msg.css({
        'top' : height/2 - (msg.height() / 2) -100, // similar
        'z-index' : 1500,                        // make sure element is on top
    });
  
   
   
   $(window).resize(function() {
   var msg = $('#overlay');
    var height = $(window).height();

    msg.css({
        'top' : height/2 - (msg.height() / 2) -100, // similar
        'z-index' : 1500,                        // make sure element is on top
    });
});

var i = false;


$('#close').mouseup(function() {
  if (i == false) {
   
   $('#overlay').animate({
    opacity: 0.1,

  }, 1000, function() {
   i = true
  });

   
   
   
	$("#close").html("Zin om te lezen?");
} else if(i = true) {
      $('#overlay').animate({
    opacity: 1.0,

  }, 1000, function() {
    i = false
  });
	$("#close").html("Zin om te tekenen?");
}
});



});