5568 sujets

Sémantique web et HTML

Bonjour,

J'ai besoin de votre aide pour savoir comment on installe correctement l'effet slimbox car j'ai essayé mais cela ne marche pas... mon navigateur ne parvient pas à ouvrir la page.

Voici un extrait du code, merci pour votre aide ! Smiley smile

<head>
		<meta charset="utf-8" />
		<title>galerie-test</title>
		<script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/js/slimbox2.js"></script>
<link rel="stylesheet" href="/css/slimbox2.css" type="text/css" media="screen" /> 
	</head>
	
	<body>
	<a href="images/senart-1" rel="lightbox-parking" title="parking"><img src="images/senart-1" /></a>
	<a href="images/senart-2" rel="lightbox-parking" title="parking"><img src="images/senart-2" /></a>
J'ai trouvé une partie de mon erreur: j'avais oublié le.jpg en nommant mes fichiers.
Cependant, maintenant mes images s'affichent dans leur taille d'origine et lorsque je clique dessus cela ne fait pas l'effet slimbox, mais cela ouvre l'image seule dans une autre fenêtre.

Comment puis-je obtenir l'effet "lightbox" en cliquant sur mes images?
Bonsoir,
cothias a écrit :
Comment puis-je obtenir l'effet "lightbox" en cliquant sur mes images?

En suivant correctement les instructions, ce que tu n'as sans doute pas fait ici. Par exemple je lis dans ton code rel="lightbox-parking", là où de nombreux scripts de type «lightbox» attendent le code rel="lightbox". Si tu changes la valeur de l'attribut rel et que de son côté le script a un fonctionnement du type «je récupère tous les liens qui ont un attribut rel avec la valeur "lightbox", et pas les autres, pour appliquer un traitement particulier», forcément ça ne marche plus.

Par ailleurs, ce genre d'effet est utilisé pour accéder à une image plein format à partir d'une vignette. Il faut donc référencer deux images différentes dans ton code, par exemple:

<a href="images/senart-1.jpg" rel="lightbox">
  <img src="images/senart-1-small.jpg" />
</a>