Logo GNT
Actualités Tests & Guides Bons Plans
GTA 6 iPhone 17 Copilot Switch 2 Temu ChatGPT Tesla
OVH Cloud OVH Cloud
Entraide Développement Développement Langage JavaScript diaporama manuel

diaporama manuel

5 réponses
Avatar
truckmuch
bonjour,

dans le fichier index, j'appelle la page suivante :

<a href="diaporama.php" onclick="window.open('diaporama.php',
'diaporama','width=660 height=675 left=140 top=25'); return
false;">diaporama manuel</a>
<br>

dans le fichier diaporama, j'ai le script suivant :

<DIV ID=ejs_photo_box></DIV>
<SCRIPT LANGUAGE=JavaScript>
ejs_photo = new Array;
<?php
$a = 0;
$handle = opendir("images");
while (($file = readdir())!=false) {
clearstatcache();
if($file!=".." && $file!=".")
{
echo "ejs_photo[$a] = 'images/$file';
";
$a++;
}
}
closedir($handle);
?>
function ejs_aff_photos(num)
{
if(document.getElementById)
{
ejs_fin = "";
if(num!=0)
ejs_fin += "<A HREF=# onClick='ejs_aff_photos("+(num-1)+");
return(false)'>
&lt;Précédent</A>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
if(num!=(ejs_photo.length-1))
ejs_fin += "<A HREF=# onClick='ejs_aff_photos("+(num+1)+");
return(false)'>
Suivant &gt;</A>";
document.getElementById("ejs_photo_box").innerHTML = "<CENTER>
<IMG SRC='"+ejs_photo[num]+"'
BORDER=0><BR>"+ejs_fin+"</CENTER>";
}
}
window.onload = new Function("ejs_aff_photos(0)")
</SCRIPT>

le diaporama fonctionne bien, mais les commandes " Précédent " et "
Suivant "
se balladent dans la fenetre, en fonction de l'orientation des photos,

ma question :
comment fixer ces commandes, en bas de fenêtre, indépendamment
de l'orientation des photos ?

merci
mic
Signaler un problème avec ce contenu

5 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
ASM
bonjour,

dans le fichier index, j'appelle la page suivante :

<a href="diaporama.php" onclick="window.open('diaporama.php',
'diaporama','widthf0 heightg5 left0 top%'); return
false;">diaporama manuel</a>
<br>

dans le fichier diaporama, j'ai le script suivant :


<style type="text/css">
p { text-align: center; }
#B_1 { margin-right: 60%; }
</style>
</head>
<body>

<DIV ID=ejs_photo_box></DIV>
<SCRIPT LANGUAGE=JavaScript>


<script type="text/javascript">

ejs_photo = new Array;
<?php
$a = 0;
$handle = opendir("images");
while (($file = readdir())!úlse) {
clearstatcache();
if($file!=".." && $file!=".")
{


echo "ejs_photo[$a] = new Image();
ejs_photo[$a].src = 'images/$file';

";
$a++;
}
}
closedir($handle);
?>
function ejs_aff_photos(num)
{
if(document.getElementById)
{
var A = document.getElementById('B_1').style;

A.visibility = (num!=0) 'visible' : 'hidden';
var B = document.getElementById('B_2').style;
B.visibility = (num!=(ejs_photo.length-1)) 'visible' : 'hidden';
}
if(document.images) {
if(num<0) num = ejs_photo.length-1;
if(num == ejs_photo.length-1) num = 0;
document.images['visu'].src = ejs_photo[num].src;
}
}

window.onload = new Function("ejs_aff_photos(0)")
</SCRIPT>
<p>

<a href="#" id="B_1"
onclick="ejs_aff_photos(num-1); return false;">Précédente</a>
<a href="#" id="B_2"
onclick="ejs_aff_photos(num+1); return false;">Suivante</a>
</p>
<p>
<img id="visu" name="visu" SRC="" alt="">
</p>
</body>
</html>

Avatar
ASM

dans le fichier diaporama, j'ai le script suivant :




<html>
<head>
<style type="text/css">
p { text-align: center; }
#B_1 { margin-right: 60%; }
</style>

<script type="text/javascript">

ejs_photo = new Array;
<?php
$a = 0;
$handle = opendir("images");
while (($file = readdir())!úlse) {
clearstatcache();
if($file!=".." && $file!=".")
{

echo "ejs_photo[$a] = new Image();
ejs_photo[$a].src = 'images/$file';

";
$a++;
}
}
closedir($handle);
?>

function ejs_aff_photos(num)
{
if(document.images) {
if(num<0) num = ejs_photo.length-1;
if(num == ejs_photo.length) num = 0;
document.images['visu'].src = ejs_photo[num].src;
}
if(document.getElementById)
{
var A = document.getElementById('B_1').style;
A.visibility = (num!=0)? 'visible' : 'hidden';
var B = document.getElementById('B_2').style;
B.visibility = (num!=(ejs_photo.length-1))? 'visible' : 'hidden';
}
}
onload = function() { ejs_aff_photos(num=0); }
</script></head>
<body>
<p>
<a href="#" id="B_1"
onclick="ejs_aff_photos(num-=1); return false;">Précédente</a>
<a href="#" id="B_2"
onclick="ejs_aff_photos(num+=1); return false;">Suivante</a>
</p>
<p>
<img id="visu" name="visu" SRC="" alt="">
</p>
</body>
</html>


Avatar
truckmuch
ASM a émis l'idée suivante :

<html>


<head>
<style type="text/css">
p { text-align: center; }
#B_1 { margin-right: 60%; }
</style>

<script type="text/javascript">

ejs_photo = new Array;
<?php
$a = 0;
$handle = opendir("images");
while (($file = readdir())!úlse) {
clearstatcache();
if($file!=".." && $file!=".")
{

echo "ejs_photo[$a] = new Image();
ejs_photo[$a].src = 'images/$file';

";
$a++;
}
}
closedir($handle);
?>

function ejs_aff_photos(num)
{
if(document.images) {
if(num<0) num = ejs_photo.length-1;
if(num == ejs_photo.length) num = 0;
document.images['visu'].src = ejs_photo[num].src;
}
if(document.getElementById)
{
var A = document.getElementById('B_1').style;
A.visibility = (num!=0)? 'visible' : 'hidden';
var B = document.getElementById('B_2').style;
B.visibility = (num!=(ejs_photo.length-1))? 'visible' : 'hidden';
}
}
onload = function() { ejs_aff_photos(num=0); }
</script></head>
<body>
<p>
<a href="#" id="B_1"
onclick="ejs_aff_photos(num-=1); return false;">Précédente</a>
<a href="#" id="B_2"
onclick="ejs_aff_photos(num+=1); return false;">Suivante</a>
</p>
<p>
<img id="visu" name="visu" SRC="" alt="">
</p>
</body>
</html>


merci ASV
pour cette solution qui marche correctement,
mais j'aurai préféré les commandes "précédante" "suivante"
en bas de la fenêtre ouverte
quelles sont les modifications à faire sur ton programme ?

mic



Avatar
ASM

mais j'aurai préféré les commandes "précédante" "suivante"
en bas de la fenêtre ouverte
quelles sont les modifications à faire sur ton programme ?


heu ... c'est une bête page en html
même si mâtinée de php et de javascript ... !

suffit de mettre la ligne des liens après l'image

mais, à mon avis : mauvaise idée

la ligne se baladera au rythme des photos horizontales et verticales

Avatar
truckmuch
Il se trouve que ASM a formulé :

mais j'aurai préféré les commandes "précédante" "suivante"
en bas de la fenêtre ouverte
quelles sont les modifications à faire sur ton programme ?


heu ... c'est une bête page en html
même si mâtinée de php et de javascript ... !

suffit de mettre la ligne des liens après l'image

mais, à mon avis : mauvaise idée

la ligne se baladera au rythme des photos horizontales et verticales


c'est ce que je crains effectivement