Accueil > > > DEFILEMENT D'IMAGES POUR ALBUMS PHOTOS
DEFILEMENT D'IMAGES POUR ALBUMS PHOTOS
Information sur la source
Description
bonjour ce code, principalement en javascript, permet de faire defiler des images, et d'en selectionner une en particulier, sans recharger la page pour chaque images (tres pratique pour les ablums photos) il n'y a que la variable $photos a renseigner. il s'agit d'un tableau, où l'on insere les chemins d'acces des images. ////////////////////////// EDIT: le code a était modifier pour lister l'ensemble des images d'un dossier. il faut renseigner la variable $nom_repertoire, pour indiquer le repertoire a lister.
Source
- <?php
- //nom du répertoire contenant les images à afficher
- $nom_repertoire = "images;
-
- // extensions acceptées
- $extensions_ok = array("jpg","gif","png","jpeg", "JPG", "GIF", "PNG", "JPEG");
-
- //on ouvre le repertoire
- $dossier = opendir($nom_repertoire);
- $i = 0;
-
-
- $photos = array();
-
- //on les stocke les noms de fichiers images dans un tableau
- while ($fichier = readdir($dossier))
- {
- if(in_array(strtolower(substr($fichier, -3)),$extensions_ok)) $photos[] = $fichier;
-
- }
-
- //on ferme le répertoire
- closedir($dossier);
-
- //on peut trier le tableau par ordre alphabétique:
- // array_multisort($photos, SORT_ASC);
-
- $count_photos = count($photos);
-
- ?>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>Untitled Document</title>
- <script type="text/javascript" >
- <!--
- var rotate_delay = 4000; // delais en microseconde (4000 = 4 secs)
- current = 0;
-
- function lessdelay() {
- if (rotate_delay <= 1000) {
- rotate_delay = rotate_delay-100;
- document.slideform.delay.value = rotate_delay;
- }else {
- rotate_delay = rotate_delay-500;
- document.slideform.delay.value = rotate_delay;
- }
- }
-
- function moredelay() {
- if (rotate_delay < 1000) {
- rotate_delay = rotate_delay+100;
- document.slideform.delay.value = rotate_delay;
- }else {
- rotate_delay = rotate_delay+500;
- document.slideform.delay.value = rotate_delay;
- }
- }
-
- function next() {
- if (document.slideform.slide[current+1]) {
- document.images.show.src = document.slideform.slide[current+1].value;
- document.slideform.slide.selectedIndex = ++current;
- }else first();
- }
-
- function previous() {
- if (current-1 >= 0) {
- document.images.show.src = document.slideform.slide[current-1].value;
- document.slideform.slide.selectedIndex = --current;
- }else last();
- }
-
- function first() {
- current = 0;
- document.images.show.src = document.slideform.slide[0].value;
- document.slideform.slide.selectedIndex = 0;
- }
-
- function last() {
- current = document.slideform.slide.length-1;
- document.images.show.src = document.slideform.slide[current].value;
- document.slideform.slide.selectedIndex = current;
- }
-
- function ap(text) {
- document.slideform.slidebutton.value = (text == "Stop") ? " > " : "Stop";
- rotate();
- }
- function change() {
- current = document.slideform.slide.selectedIndex;
- document.images.show.src = document.slideform.slide[current].value;
- }
-
- function rotate() {
- if (document.slideform.slidebutton.value == "Stop") {
- current = (current == document.slideform.slide.length-1) ? 0 : current+1;
- document.images.show.src = document.slideform.slide[current].value;
- document.slideform.slide.selectedIndex = current;
- window.setTimeout("rotate()", rotate_delay);
- }
- }
- -->
- </script>
- </head>
-
- <body>
- <form name="slideform" action="" id="slideform" style="margin:0px">
- <table width="100%" >
- <tr>
- <td nowrap="nowrap">
- <b>Il y a <?php echo $count_photos; ?></b> Photo<?php echo (($count_photos>1)? "s": ""); ?>
- <select name="slide" onchange="change();">
- <?php
- for($i=0; $i < count($photos); $i++) echo "<option value=\"".$photos[$i]."\" ".(($i==0)? "selected=\"selected\"" : ""). ">- ".($i+1)." -</option>";
- ?>
- </select>
- </td>
- <td nowrap="nowrap" align="right">
- <input type="button" onclick="previous();" value="«" title="Précédente" />
- <input type="button" onclick="ap(this.value);" name="slidebutton" value=" > " title="Défilement Automatique" />
- <input type="button" onclick="next();" value="»" title="Suivante" /></td>
- </tr></table>
- </form>
-
- <table width="100%" >
- <tr><td colspan="2" align="center" width="100%">
- <img alt="" src="<?php echo $photos['0']; ?>" id="show" />
- </td>
- </tr>
- </table>
- </body>
- </html>
<?php
//nom du répertoire contenant les images à afficher
$nom_repertoire = "images;
// extensions acceptées
$extensions_ok = array("jpg","gif","png","jpeg", "JPG", "GIF", "PNG", "JPEG");
//on ouvre le repertoire
$dossier = opendir($nom_repertoire);
$i = 0;
$photos = array();
//on les stocke les noms de fichiers images dans un tableau
while ($fichier = readdir($dossier))
{
if(in_array(strtolower(substr($fichier, -3)),$extensions_ok)) $photos[] = $fichier;
}
//on ferme le répertoire
closedir($dossier);
//on peut trier le tableau par ordre alphabétique:
// array_multisort($photos, SORT_ASC);
$count_photos = count($photos);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<script type="text/javascript" >
<!--
var rotate_delay = 4000; // delais en microseconde (4000 = 4 secs)
current = 0;
function lessdelay() {
if (rotate_delay <= 1000) {
rotate_delay = rotate_delay-100;
document.slideform.delay.value = rotate_delay;
}else {
rotate_delay = rotate_delay-500;
document.slideform.delay.value = rotate_delay;
}
}
function moredelay() {
if (rotate_delay < 1000) {
rotate_delay = rotate_delay+100;
document.slideform.delay.value = rotate_delay;
}else {
rotate_delay = rotate_delay+500;
document.slideform.delay.value = rotate_delay;
}
}
function next() {
if (document.slideform.slide[current+1]) {
document.images.show.src = document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex = ++current;
}else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex = --current;
}else last();
}
function first() {
current = 0;
document.images.show.src = document.slideform.slide[0].value;
document.slideform.slide.selectedIndex = 0;
}
function last() {
current = document.slideform.slide.length-1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == "Stop") ? " > " : "Stop";
rotate();
}
function change() {
current = document.slideform.slide.selectedIndex;
document.images.show.src = document.slideform.slide[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {
current = (current == document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout("rotate()", rotate_delay);
}
}
-->
</script>
</head>
<body>
<form name="slideform" action="" id="slideform" style="margin:0px">
<table width="100%" >
<tr>
<td nowrap="nowrap">
<b>Il y a <?php echo $count_photos; ?></b> Photo<?php echo (($count_photos>1)? "s": ""); ?>
<select name="slide" onchange="change();">
<?php
for($i=0; $i < count($photos); $i++) echo "<option value=\"".$photos[$i]."\" ".(($i==0)? "selected=\"selected\"" : ""). ">- ".($i+1)." -</option>";
?>
</select>
</td>
<td nowrap="nowrap" align="right">
<input type="button" onclick="previous();" value="«" title="Précédente" />
<input type="button" onclick="ap(this.value);" name="slidebutton" value=" > " title="Défilement Automatique" />
<input type="button" onclick="next();" value="»" title="Suivante" /></td>
</tr></table>
</form>
<table width="100%" >
<tr><td colspan="2" align="center" width="100%">
<img alt="" src="<?php echo $photos['0']; ?>" id="show" />
</td>
</tr>
</table>
</body>
</html>
Historique
- 18 août 2006 12:31:06 :
- le code a était modifier pour lister l'ensemble des images d'un dossier, au lieu de renseigner un tableau
Sources du même auteur
Sources de la même categorie
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
Afficher images automatique [ par sensosofttunisiee ]
Salut,j'ai un bouton "Auto" qui me permet d'afficher un groupe d'images du maniere automatique cad image apres l'autre et autre bouton "Stop" pour int
php/mysql et album photo sécurisé [ par pumbaa ]
Salut!! J’ai crée un album d’image avec php/MySQL. Les images ce trouvent
Afficher une image en fonction d'un pourcentage [ par loupile ]
Bonjour à tous, je m'explique alors voilà j'ai un album dans lequel j'ai une ou plusieurs images stockées dans une base de données. ces images dans
ajouter des images [ par samia22 ]
Bonsoir; j'ai un probleme... je travaille coté administrateur... j'ajout des produits a la base de données avec ses images... l'ajout de prod
comment afficher des images une popup php javascript [ par tupense ]
Bonjour je me perd un peu dans les rubriques désolé j'ai fait un script en php pour lister des dossiers dans un dossier puis je l'ai ai mis sous forme
upload d'images en php [ par azorkot ]
salut je travail sur mon projet de fin d'année et là j'essaie d'uploader des images!! mais j'arrive pas à les stocker ou plutôt à les afficher dans le
Est-il possible?? [ par djibidl ]
Est-il possible, De créer un répertoire et d'y mettre des fichiers de manière automatique en PHP? J'ai un mini-projet qui consiste à générer automatiq
ImageFlow Lightbox [ par code32 ]
Bonjour, J'utilise ImageFlow, et maintenant j'ai besoin d'activer l'effet lightbox sur les images. ImageFlow me permettre d'écrire la fonction onc
infobulles-affichage d'images [ par azorkot ]
salut! j'ai un problème et j'aimerais que vous m'aidiez. je dois faire une page html ou je devrais afficher des images d'articles. j'ai fais les étape
création d'une imagette à l'aide imagecreatefromjpeg [ par azorkot ]
bonsoir j'ai un problème avec la création de la miniature d'une image en utilisant la fonction imagecreatefromjpeg. avant j'avais un fatalerror j'ai p
|
Derniers Blogs
ETENDRE LE TEAM WEB ACCESS DE TFS 2012 - STEP 0ETENDRE LE TEAM WEB ACCESS DE TFS 2012 - STEP 0 par Philess
L'extensibilité du Team Web Access
Le Web Access (site d'équipe) de Team Foundation Server a été complètement réécrit dans la version 2012 avec pas moins de 400.000 lignes de JavaScript. Ce nouveau modèle a été pensé pour offrir de grandes...
Cliquez pour lire la suite de l'article par Philess SIMULER FACILEMENT L'ENVOI DE MAILSIMULER FACILEMENT L'ENVOI DE MAIL par JeremyJeanson
il m'a été demandé, à plusieurs reprises, comment je faisais pour simuler l'envoi de mail lors de mes démos de Workflow Foundation. Ma solution est plutôt simple : j'utilise la configuration par défaut du SmtpClient et j'oriente les mails vers un dossier ...
Cliquez pour lire la suite de l'article par JeremyJeanson VOTEZ POUR LE TOP 10 DES INFLUENCEURS SHAREPOINT FRANCOPHONES !VOTEZ POUR LE TOP 10 DES INFLUENCEURS SHAREPOINT FRANCOPHONES ! par Patrick Guimonet
Si ce n'est déjà fait (comme plus de 600 personnes déjà), il est encore temps de voter pour le concours TOP 10 des influenceurs SharePoint francophones ! Il est organisé par harmon.ie et accessible ici : http://harmon.ie/top-...
Cliquez pour lire la suite de l'article par Patrick Guimonet [CONF'SHAREPOINT] DERNIER RAPPEL ! :-)[CONF'SHAREPOINT] DERNIER RAPPEL ! :-) par Patrick Guimonet
La Conf'SharePoint en chiffres c'est : 3 jours de SharePoint ! 4 parcours et 60 sessions 17 partenaires représentant toutes les fac...
Cliquez pour lire la suite de l'article par Patrick Guimonet
Forum
WMIC CSPRODUCT WMIC CSPRODUCT par gpsa1
Cliquez pour lire la suite par gpsa1
Logiciels
Easy-Planning (4.5.0.11)EASY-PLANNING (4.5.0.11)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté a... Cliquez pour télécharger Easy-Planning CVEasy (3.1.0.51)CVEASY (3.1.0.51)PHMSD-CVEasy est un logiciel d'aide à la rédaction de CV d'une simplicité déconcertante.
PHMSD-C... Cliquez pour télécharger CVEasy LettresFaciles 2011 (8.6.0.31)LETTRESFACILES 2011 (8.6.0.31)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011 sDEVIS-FACTURES vlPRO (8.4.2.62)SDEVIS-FACTURES VLPRO (8.4.2.62)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO Devis-Factures PHMSD (2.1.0.11)DEVIS-FACTURES PHMSD (2.1.0.11)Configuration minimale
Nécessite Windows™ 2000, XP, Windows 7, 8, Vista (Service Pack à... Cliquez pour télécharger Devis-Factures PHMSD
|