<html>
<head>
<title>Websitenaam</title>
<link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="/fancybox/jquery.easing-1.4.pack.js"></script>
<script type="text/javascript" src="/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
</head>
<body>
<script type="text/javascript"> 
$(document).ready(function() {
	
	$("a#single_image").fancybox();	
	$("a#inline").fancybox({
		'hideOnContentClick': true
	});	
	$("a.group").fancybox({
		'transitionIn'	:	'elastic',
		'transitionOut'	:	'elastic',
		'speedIn'		:	600, 
		'speedOut'		:	200, 
		'overlayShow'	:	false
	});
	
});
</script>


<!-- 
Wil je inplaats van 1 afbeelding een gallerij? verander hier boven dan: $("a.group").fancybox({ in $("a.grouped_elements").fancybox({
-->








<!-- 1 afbeelding -->
<a id="single_image" href="image_big.jpg"><img src="image_small.jpg" alt=""/></a>
<!-- Einde 1 afbeelding -->




<!-- Afbeelding gallerij-->
<a class="grouped_elements" rel="group1" href="image_big_1.jpg"><img src="image_small_1.jpg" alt=""/></a>
<a class="grouped_elements" rel="group1" href="image_big_2.jpg"><img src="image_small_2.jpg" alt=""/></a> 	
<a class="grouped_elements" rel="group2" href="image_big_3.jpg"><img src="image_small_3.jpg" alt=""/></a> 
<a class="grouped_elements" rel="group2" href="image_big_4.jpg"><img src="image_small_4.jpg" alt=""/></a> 
<!-- Afbeelding gallerij-->
</body>
</html>