$(document).ready(function(){
	/**
	* Gibt es Overlay-Elemente, werden die entsprechenden Container dynamisch erstellt
	*/
	if($('.overlayIframe').length > 0){
		/**
		* Iframe dynamisch erstellen
		*/
		$('body').append('<div class="overlay" id="overlayIframe"><iframe src ="" width="100%" height="620px" frameborder="0"></iframe></div>');
	}
});

$(function() {
	$("a.overlayElement[rel]").click(function(){
		$('div.overlay iframe').attr('src', $(this).attr('href'));
	});

    // if the function argument is given to overlay,
    // it is assumed to be the onBeforeLoad event listener
    $("a.overlayElement[rel]").overlay({

        expose: 'black', <!---Change overlay color here--->
        effect: 'apple',

        onBeforeLoad: function() {

            // grab wrapper element inside content
            var wrap = this.getContent().find(".contentWrap");

            // load the page specified in the trigger
            wrap.load(this.getTrigger().attr("href"));
        }

    });
});

$(function() {
    $("#triggers img[rel]").overlay({effect: 'apple'});
});