Fancybox goes iframe everywhere


Omdat ik behoefte had aan een jqueryplugin die op een gebruikersvriendelijke manier contextmenu's en feedbackforms kan tonen heb ik fancybox [ http://fancybox.net/ ] aangepast zodat er iframe- en ajax content overal op de pagina getoond kan worden. Dit is handig voor WUW-navigatie (What do U Want to do) waarbij de gebruiker stap voor stap door een proces geleid moet worden. De positie van het modale venster hangt af van de positie van het element waarop geklikt wordt en de afmetingen van het browserwindow.
Work is still in progress

Dit is een link met een cluetip en een fancymenu
De tooltip is ook een jquery plugin : Cluetip [ http://plugins.learningjquery.com/cluetip/demo/ ]

Voorbeeld:

	$.fancybox.load({
			'width'			: '30%',
			'height'		: '40%',
			'scrolling'		: 'no',
			'type'			: 'iframe',
			'overlayOpacity'	:  0.5,
			'overlayColor'		: '#ccc',
			'href'			: 'xhr/info.php',
			'left'			: "target",
			'top'			: "target"
	});
	

De fancybox default properties zijn uitgebreid met een aantal nieuwe:

//new----------------------------
		left				:   'auto',
		top				:   'auto',
		offsetX				:   0,
		offsetY				:   0,
		minHeight			:   false,
		minWidth			:   false,
		IframeAdjust			:   false

left : {string} "target" of waarde. Als target dan is de positie van het venster afhankelijk van het element waarop geklikt wordt
top : {string} "target" of waarde. Als target dan is de positie van het venster afhankelijk van het element waarop geklikt wordt
offsetX : {integer} horizontale offset van het venster
offsetY : {integer} verticale offset van het venster
minHeight : {integer} minimale hoogte van het venster,disabled if false. Te gebruiken bij percentuele hoogte
minWidth : {integer} minimale breedte van het venster, disabled if false. Te gebruiken bij percentuele breedte
IframeAdjust : {boolean} standaar false, als true dan wordt het formaat van het iframe aangepast aan de inhoud

Zie verder de documentatie op http://fancybox.net/



De Code: