En kon dan nog even hierop terug.
<a href="foto.jpg" rel="lightbox" title="Korte naam foto"><img src="thumbnail.jpg" alt="Korte naam foto"></a>
) Ik had van lightbox nog niet gehoord, maar ik denk dat ik het zelf wel zal gaan gebruiken in de foto website die ik aan het maken ben. Ik had zoiets al in gedachte, en nu hoef ik het zelf niet meer helemaal te schrijven. Dus bedankt voor je topic hier te zetten!
)
Tweet
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Test Foto's Lightbox2</title>
<link rel="stylesheet" href="css/screen.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen">
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery-ui-1.8.18.custom.min.js"></script>
<script src="js/jquery.smooth-scroll.min.js"></script>
<script src="js/lightbox.js"></script>
<style>
h1 {
margin-bottom: 15px;
margin-left: 5px;
}
#menu {
margin: 10px;
}
.thumb {
float: left;
margin: 10px;
}
.thumb img {
border: 1px rgb(255,255,0) solid;
}
</style>
</head>
<body>
<h1>Test Foto's Lightbox2</h1>
<div id="menu">Hier komt het menu.</div>
<div id="fotoThumb">
<div class="thumb"><a href="foto/DSC_8632.jpg" rel="lightbox" title="Groep 1.1"><img src="foto/DSC_8632t.jpg" alt="Groep 1"></a></div>
<div class="thumb"><a href="foto/DSC_8637.jpg" rel="lightbox[auto1]" title="Groep 2.1"><img src="foto/DSC_8637t.jpg" alt="Groep 2"></a></div>
<div class="thumb"><a href="foto/DSC_8638.jpg" rel="lightbox[auto1]" title="Groep 2.2"><img src="foto/DSC_8638t.jpg" alt="Groep 2"></a></div>
<div class="thumb"><a href="foto/DSC_8641.jpg" rel="lightbox[auto2]" title="Groep 3.1"><img src="foto/DSC_8641t.jpg" alt="Groep 3"></a></div>
<div class="thumb"><a href="foto/DSC_8648.jpg" rel="lightbox[auto2]" title="Groep 3.2"><img src="foto/DSC_8648t.jpg" alt="Groep 3"></a></div>
<div class="thumb"><a href="foto/DSC_8651.jpg" rel="lightbox[auto2]" title="Groep 3.3"><img src="foto/DSC_8651t.jpg" alt="Groep 3"></a></div>
</div>
</body>
</html>
Comment