Foto openen midden vd pagina

R-Mijnten · 31 Augustus 2011

Goedemiddag allemaal!

Ik ben momenteel bezig met een foto pagina.. Lukt allemaal aardig alleen...

Ik wil graag dat als je op een foto klikt om uit te vergroten dat de foto in het midden van de pagina verschijnt. Nu word de foto groter op de plek waar de foto staat..

Wie kan me helpen?

Hier het script:
http://codeviewer.org/view/code:1e0b

Alvast bedankt!

Gr. Ruben

zwpgangster · 31 Augustus 2011

Dit is een lightbox

Bekijk de onderstaande website en donwload het.
(filmpjes, tekst, afbeeldingen en flash bestanden)

http://fancybox.net/

Als je het gedownload hebt, instructie:

PHP

<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>

Toon Meer

Partner Gezocht om meerdere NFT Collecties op Open Sea te Plaatsen

Plesk installer

cpanel / whm themes

PHP Point of Sale

Probleem omtrent Tinymce

Kunnen jullie mij helpen met deze enquete

een eigen cloud sever

Probleem C++ en CL

193 Nieuwe domeinnamen April 2025

228 Nieuwe domeinnamen Maart 2025

285 Nieuwe domeinnamen Februari 2025

Foto openen midden vd pagina

Participate now!

Fijne feestdagen

Kritieke update voor Really Simple Security-plug-in

ING Nederland streeft naar ondersteuning van Google Pay tegen eind februari

Functioneel ontwerp

Access Control List implementatie in PHP/MySQL - deel 1/2

Access Control List implementatie in PHP/MySQL - deel 2/2

Delen