tabreeds=0;

function maaklichtbox()
{
	
$(document).ready(function(){
		   
   $("#gallery a").lightBox
({
	overlayBgColor: '#000000',
	overlayOpacity: 0.8,
	imageLoading:			'images/lightbox-loading.gif',		// (string) Path and the name of the loading icon
	imageBtnPrev:			'images/lightbox-prev.gif',			// (string) Path and the name of the prev button image
	imageBtnNext:			'images/lightbox-next.gif',			// (string) Path and the name of the next button image
	imageBtnClose:			'images/lightbox-close.gif',		// (string) Path and the name of the close btn
	imageBlank:				'images/lightbox-leeg.gif',			// (string) Path and the name of a blank image (one pixel)
	containerResizeSpeed: 550,
	txtImage: 'Plaatje',
	txtOf: 'van'
   });

 });
};

function maaktab()
{


   $(document).ready(function(){  
     /*Since all the tabs are hidden with css we are displaying the tab with class .active_tab using fadeIn() 
     function. If you just want it to show with no effect, just put show() instead of fadeIn() */  
    $('.active_tab').fadeIn(); 
	var content = $('.tab_link_selected').attr('rel');
	var container_id = $('.tab_link_selected').attr('name'); 
  $(container_id).load(content,
			function(){
				});
				
				
  if (tabreeds==0)
  {
	  
	  tabreeds=1;
    //when a tab link is clicked...  
    $('.tab_link').live('click', function(event){  
  
        /*...prevent the default behaviour...*/  
        event.preventDefault();  
  
        /* ...remove the tab_link_selected class from current active link... */  
        $('.tab_link_selected').removeClass('tab_link_selected');  
  
        /* ...and add it to the new active link */  
        $(this).addClass('tab_link_selected');  
  
        /*...get the title attribute (which corensponds to the id of the needed text container), 
        but you can use any attribute you want*/  
        var container_id = $(this).attr('name');
		var content = $(this).attr('rel'); 
  
        //...animate the current active_tab by changing it's height and opacity ...'  
        $('.active_tab').animate({  
  
            height : 'toggle' , opacity : 'toggle'
  
        //...and when that animation ends...  
        },function(){  
  
            //...remove the active_tab class from the current active tab...  
            $(this).removeClass('active_tab');  
  
            //...and add that class to the tab that corensponds the clicked link...  
            $(container_id).addClass('active_tab');
			$(container_id).load(content,
			function(){
			           });

  
            //...and animate the new active_tab by using toggle on height and opacity again...  
            $('.active_tab').animate({  
  
                height : 'toggle' , opacity : 'toggle'
  
 
			}); 
			
        });  
										 
    });  
	 };
});  

};

function maakmenublob(){

	
$(document).ready(function(){
menuplaats=345;
  $('<div id="navigation_blob"></div>').css({
top:$('#nav li:first a').offset().top-5,
		width: $('#nav li:first a').width() + 10,
		height: $('#nav li:first a').height() + 10
	}).appendTo('#nav').hide();

  $('#nav a').hover(function(){ 
    // Mouse over function
	  $('#navigation_blob').animate(
      {width: $(this).width() + 10, left: $(this).offset().left-menuplaats},
	    {duration: 'slow', easing: 'easeOutElastic', queue: false}
    );
  }, function() { 
	  // Mouse out function
	  var leftPosition = $(this).offset().left-menuplaats;
	  $('#navigation_blob').animate(
      {width:'hide'},
			{duration:'slow', easing: 'easeOutCirc', queue:false}
		).animate({left: leftPosition}, 'fast' );
  });
});
	
	
}

function maakmenu2blob(){

	
$(document).ready(function(){
menuplaats=345;

  $('<div id="navigation_blob2"></div>').css({
top:$('#nav2:first a').offset().top,
		width:0,
		left:0,
		height: $('#nav2:first a').height()
	}).appendTo('#nav2').hide();



  $('#nav2 a').hover(function(){ 
    // Mouse over function
	  $('#navigation_blob2').animate(
      {width: $(this).width() + 10, left: $(this).offset().left-menuplaats},
	    {duration: 'slow', easing: 'easeOutElastic', queue: false}
    );
  }, function() { 
	  // Mouse out function
	  var leftPosition = $(this).offset().left-menuplaats;
	  $('#navigation_blob2').animate(
      {width:'hide'},
			{duration:'fast', easing: 'easeOutCirc', queue:false}
		).animate({left: leftPosition}, 'fast' );
	  $('#navigation_blob2').left=0;
  });
  
});
	
	
}


function maakmenurol(){

$(document).ready(function () {   
      
    $('#nav li').hover(  
        function () {  
            //show its submenu  
            $('ul', this).slideDown(300);  
  
        },   
        function () {  
            //hide its submenu  
            $('ul', this).slideUp(0);           
        }  
    );  
      
}); 

}


$('.menu1lb').live('mouseover mouseout', function(event) {
												  	
var kl=$(this).attr('rel');
var id=$(this).attr('id');
var lk=$('#div'+id).attr('rel');
var l= lk.split("#");
var punt=kl.indexOf(".")
var k= kl.split("#");
  if (event.type == 'mouseover') {
$('#div'+id).css("color", "#"+l[1]);	  
	  if (punt==-1) {
$(this).css('background-color',"#"+k[1]);
	  } else {
$('#img'+id).attr("src", k[1]);
	  }
  } else {
$('#div'+id).css("color", "#"+l[0]);
	  if (punt==-1) {
$(this).css('background-color',"#"+k[0]);
	  } else {
$('#img'+id).attr("src", k[0]);
	  }
  }
});

$('.menu1lb').live('click', function() {

var kl=$(this).attr('rel');
var k= kl.split("#");
//$('#main').css('background-color',"#"+k[0]);
});

$(function() {
    $('#plaatjelb').each(function() {
        var maxWidth = 100; // Max width for the image
        var maxHeight = 100;    // Max height for the image
        var width = $(this).width();    // Current image width
        var height = $(this).height();  // Current image height
        // Check if the current width is larger than the max
        if(width>height && width>maxWidth)
        {
            ratio = maxWidth / width;   // get ratio for scaling image
            $(this).css("width", maxWidth); // Set new width
            $(this).css("height", height * ratio); // Scale height based on ratio
        }
        else if(height>width && height>maxHeight)
        {
            ratio = maxHeight / height; // get ratio for scaling image
            $(this).css("height", maxHeight);   // Set new height
            $(this).css("width", width * ratio);    // Scale width based on ratio
        }
    });
});