Accueil > galerie > galerie-javascript

{ Galerie javascript 'couloir.org' }

Introduction

Cette galerie développé par John Ansermet est basé sur JavaScript mais utilise quelque élément en Flash tel que les sons lors du passage de la souris sur les flèches. Très design, idéal pour un petit album photo ou une présentation de quelques images mais devient vite difficile a utilisé si vous pensez y mettre beaucoup de photos. En effet, la configuration se fait directement dans le script .JS pas super pratique pour les modifications...

Galerie Javascript

  • Idéal pour quelques photos bien sélectionnées
  • Redimenssionnement automatique des images
  • Affichage d'une description

Liaison des fichiers nécessaires dans l'en-tête

A placer entre les balises et de la page qui va contenir la galerie :

// Include des librairies Javascript
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js"></script>
<script type="text/javascript" src="js/behaviour.js"></script>

// Gestion du son
<script type="text/javascript" src="js/soundmanager.js"></script>

// Gestion du slideshow
<script type="text/javascript" src="js/slideshow.js"></script>

<link rel="stylesheet" href="css/master.css?nov282005" type="text/css" media="screen" />

Intégration dans le corps de la page

<div id="Masthead">&nbsp;</div>
<div id="OuterContainer">
	<div id="Container">
		<img id="Photo" src="img/c.gif" alt="Photo: Couloir.org" />
		<div id="LinkContainer">
			<a href="#" id="PrevLink" title="Previous Photo"><span>Pr&eacute;c&egrave;</span></a>
			<a href="#" id="NextLink" title="Next Photo"><span>Suivante</span></a>
		</div>
		<div id="Chargement..."><img src="img/loading_animated2.gif" width="48" height="47" alt="Chargement..." /></div>
	</div>
</div>
<div id="CaptionContainer">
	<p>
		<span id="Counter">&nbsp;</span>
		<span id="Caption">&nbsp;</span>
	</p>
</div>