Pues no lo pillo [
] ¿Dónde puedo estudiar jQuery? El código completo (quitando muchas fotos para abreviar), que no funciona:
Código HTML:
<!DOCTYPE HTML>
<html>
<head>
<title> </title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all" />
<link href="css/lightbox.css" rel="stylesheet" />
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
<script>
$(function(){
$('img.thumbnail').click(function() {
$('#bigImg').attr('src', $(this).attr('src').replace(/\.jpg/, 'Big.jpg'));
// Change name and show
}).first().click(); // And activate the first one
});
</script>
</head>
<body>
<div class="contenedor">
<div class="ficha">
<div class="grande" width="510" height="380">
<a href="cuisine/gr(1).jpg" data-lightbox="foto"><img id="bigImg" src="cuisine/500px(1).jpg"></a>
<a href="cuisine/gr(2).jpg" data-lightbox="foto"><img id="bigImg" src="cuisine/500px(2).jpg"></a>
<a href="cuisine/gr(3).jpg" data-lightbox="foto"><img id="bigImg" src="cuisine/500px(3).jpg"></a>
<a href="cuisine/gr(4).jpg" data-lightbox="foto"><img id="bigImg" src="cuisine/500px(4).jpg"></a>
<a href="cuisine/gr(5).jpg" data-lightbox="foto"><img id="bigImg" src="cuisine/500px(5).jpg"></a>
</div>
<div class="sellos">
<a href="#"><img class="thumbnail" src="cuisine/120px(1).jpg"></a>
<a href="#"><img class="thumbnail" src="cuisine/120px(2).jpg"></a>
<a href="#"><img class="thumbnail" src="cuisine/120px(3).jpg"></a>
<a href="#"><img class="thumbnail" src="cuisine/120px(4).jpg"></a>
<a href="#"><img class="thumbnail" src="cuisine/120px(5).jpg"></a>
</div>
</div>
</body>
</html>
Marcadores