www.tuljo.com

This model consumes 600+ bytes of JavaScript, allows multiple instances and works in range from IE6 to FF. View source for details.

Mauris eget erat ipsum. Donec eget enim quis justo congue porta sagittis blandit diam. In ornare placerat massa, non dictum nisl aliquet quis. Donec adipiscing neque sodales lacus bibendum ac rutrum nibh ornare. Aliquam luctus CLICKITLICKIT. Curabitur sed turpis et neque imperdiet rutrum. Nam lectus velit, dignissim rutrum tristique eu, viverra laoreet urna. Sed imperdiet sodales purus, at accumsan tellus euismod nec. Proin lacus massa, accumsan at interdum eu, ullamcorper aliquet orci. Phasellus quis risus enim. Phasellus sed eros a quam bibendum aliquet quis sit amet quam. Sed turpis urna, laoreet et suscipit vitae, imperdiet in orci. In hac habitasse platea dictumst.

JavaScript/jQuery

<script type="text/javascript" src="jquery.min.1.2.6.js"></script>

<script type="text/javascript">
	function sliderAndPopup(){
		$(".slider").hide();
		$(".toggler").click(function(){
			var id=$(this).attr("id");
			var widgetId=id.substring(id.indexOf('-')+1,id.length);
			$("#slide-"+widgetId).slideToggle();
			$("#overlay:hidden").fadeIn("slow");
			if($(".popUp").is(":hidden")){
				$(this).addClass("sampleTabSelected");
			};
			$("#overlay").css({//for IE6
				"width":document.documentElement.scrollWidth,
				"height":document.documentElement.clientHeight+1000
			});
		});
		$("#overlay").click(function(){
			$("#overlay").toggle();
			$(".slider").hide();
			$(".toggler").removeClass("sampleTabSelected");
		});
	};

	$(function(){
		sliderAndPopup();
	});
</script>