Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1927 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [RESOLU] cherche script pour defilement de photos

 



 Mot :   Pseudo :  
 
 Page :   1  2
Page Précédente
Auteur Sujet :

[RESOLU] cherche script pour defilement de photos

n°1335546
xolth
Ranx.. znort!
Posté le 30-03-2006 à 14:43:09  profilanswer
 

Bonjour,
 
SVP, Connaissez-vous un script qui réponde à ce besoin:
J'ai un espace rectangulaire (750 * 200) dans lequel j'ai besoin de faire défiler des photos en continu. (vitesse réglable si possible)
Il faut donc qu'elles s'affichent en hauteur de 200pix sur une largeur variable qui  garde la proportion d'origine (pour éviter la déformation, car toutes les photos ne sont pas au même format : portrait, paysage, panoramique..).
 
Merci de votre aide


Message édité par xolth le 31-03-2006 à 00:25:16
mood
Publicité
Posté le 30-03-2006 à 14:43:09  profilanswer
 

n°1335554
anapajari
s/travail/glanding on hfr/gs;
Posté le 30-03-2006 à 14:51:41  profilanswer
 

moi j'en connais pas mais tu n'as qu'a le faire toi-même, ça sera très enrichissant j'en suis sur!!


Message édité par anapajari le 30-03-2006 à 14:52:04
n°1335673
xolth
Ranx.. znort!
Posté le 30-03-2006 à 16:45:14  profilanswer
 

Je ne suis pas assez calé pour ça malheureusement..
Et puis surtout, je sais que ça existe, j'en avais vu sur un site de scripts il y a 2/3 ans, mais j'arrive plus à mettre la main dessus.
Je maintiens donc mon appel à l'aide... Quelqu'un a surement dejà vu ça.

n°1335986
xolth
Ranx.. znort!
Posté le 31-03-2006 à 00:24:41  profilanswer
 

ok c'est bon, j'y suis arrivé tout seul..

n°1336020
fourniey
Rendre au prochain
Posté le 31-03-2006 à 02:32:12  profilanswer
 

J'aimerais bien voir ton résultat. Merci!

n°1336106
mfauxock
Posté le 31-03-2006 à 10:33:12  profilanswer
 

il a peut être regarder ici tout simplement
 
http://forum.hardware.fr/hardwaref [...] 7009-1.htm

n°1336455
xolth
Ranx.. znort!
Posté le 31-03-2006 à 16:01:23  profilanswer
 

Hé Non.. Tout le monde me dit que c'est facile, mais personne ne sait faire! Je partage ce que j'ai fait, mais si vous avez les réponses à mes questions suivantes ça serait bien sympa à vous aussi:
-Comment faire pour qu'on ne soit pas obligé de faire des thumbs (donc que le script affiche les images en calculant la bonne largeur pour la hauteur donnée)
-N'y a t il pas moyen de faire en sorte que le script prenne toutes les photos d'un répertoire donné pour ne pas être obligé d'entrer les noms de chaque fichier dans le script (et pour éviter de devoir modifier le script à achaque ajout/suppression de photo?
MERCI d'avance
Le script:
Mettre cette ligne dans la page web, à l'endroit voulu:
<SCRIPT Language="JavaScript" type="text/javascript" SRC="images/slideshow/scroll.js"></SCRIPT>
Faire un fichier texte nommé scroll.js contenant:
var leftrightslide=new Array()
var finalslide=''
 
//SPECIFIER LES IMAGES:
//DEBUT
leftrightslide[0]='<a href="images/image01.jpg" target="_blank"><img src="images/thumb01.jpg" border=0></a>'
 
leftrightslide[1]='<a href="images/image02.jpg" target="_blank"><img src="images/thumb02.jpg" border=0></a>'
 
leftrightslide[2]='<a href="images/image03.jpg" target="_blank"><img src="images/thumb03.jpg" border=0></a>'
//FIN
 
 
//Largeur
var sliderwidth="400px"
//Hauteur
var sliderheight="129px"
//Vitesse
var slidespeed=2
//Couleur de fond:
slidebgcolor="#013264"
//Espace entre chaque image: (HTML)
var imagegap=" "
//Espace entre chaque fin/début de scroll (pixels)
var slideshowgap=2
 
////NE PLUS RIEN TOUCHER A PARTIR D ICI////////////
var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide
 
function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2" ) : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3" ) : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp" ).offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup
 
function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"
 
if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"
 
}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap
 
if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}
 
 
if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}

Message cité 1 fois
Message édité par xolth le 31-03-2006 à 16:06:04
n°1336504
nargy
Posté le 31-03-2006 à 16:48:13  profilanswer
 

> le script affiche les images en calculant la bonne largeur pour la hauteur donnée
 
ya rien à calculer, tu fixe juste la hauteur sans spécifier la largeur et le navigateur fait le calcul.
 
> le script prenne toutes les photos d'un répertoire
 
ben ci dessus, tu les rentre à la main...

n°1336531
Pitsy
Posté le 31-03-2006 à 17:22:09  profilanswer
 

xolth a écrit :


-Comment faire pour qu'on ne soit pas obligé de faire des thumbs (donc que le script affiche les images en calculant la bonne largeur pour la hauteur donnée)
-N'y a t il pas moyen de faire en sorte que le script prenne toutes les photos d'un répertoire donné pour ne pas être obligé d'entrer les noms de chaque fichier dans le script (et pour éviter de devoir modifier le script à achaque ajout/suppression de photo?


 
Je n'ai pas regardé ton script, mais j'essaie quand même de répondre à tes questions ;) :
 
1) l'avantage des thumbs est d'éviter de rendre ta page trop lourde en affichant directement l'image originale. Afficher de grosses images en petits, c'est bof. Par contre, côté serveur avec du php par exemple, tu peux créer des thumbs automatiquement.
2)  pas avec javascript, non (bon il y a qq jours, quelqu'un a posté une solution, mais sur une machine en local et en utilisant la technologie activex propre à IE, donc je suppose que ce n'est pas adapté dans ton cas ). Par contre en php... :)

n°1336595
xolth
Ranx.. znort!
Posté le 31-03-2006 à 18:48:17  profilanswer
 

nargy a écrit :

> le script affiche les images en calculant la bonne largeur pour la hauteur donnée
 
ya rien à calculer, tu fixe juste la hauteur sans spécifier la largeur et le navigateur fait le calcul.
 
> le script prenne toutes les photos d'un répertoire
 
ben ci dessus, tu les rentre à la main...


 
Narguy, voici le début de ma phrase...!:
N'y a t il pas moyen de faire en sorte que le script prenne ....
 
Donc oui, je les ai rentrées à la main, mais je cherche à faire autrement.
 
Sinon merci pour l'astuce, je vais essayer sans spécifier la largeur!!


Message édité par xolth le 31-03-2006 à 18:49:17
mood
Publicité
Posté le 31-03-2006 à 18:48:17  profilanswer
 

n°1336601
xolth
Ranx.. znort!
Posté le 31-03-2006 à 19:04:44  profilanswer
 

ouais! ça marche. C'est moins beau qu'un vrai redimmensionnement, mais ça marche!! Merci, je n'aurais jamais pensé à ça!
 
Sinon, admettons qu'on limite le nombre d'images à 10, et que les images soient nommées image0, image1, image2, etc..
Dans ce cas, plus besoin d'éditer le script à chaque rajout ou suppression d'image.
par contre, si je n'ai que 6 images, les quatre dernières pour arriver à 10 n'existant pas, j'aurais des croix rouges. Est-il possible de faire une sorte de fonction "if exists" ?

n°1336705
nargy
Posté le 31-03-2006 à 21:12:17  profilanswer
 

je garanti rien, mais tu peut tester:

Code :
  1. var img=new Image();
  2. img.src=blabla url blabla
  3. if(img.complete) // l image a terminé son chargement
  4.   blabla afficher blabla

n°1336781
xolth
Ranx.. znort!
Posté le 01-04-2006 à 00:19:38  profilanswer
 

il faudrait appliquer la condition à chacun de ces blocs:
leftrightslide[0]='<a href="images/image01.jpg" target="_blank"><img src="images/thumb01.jpg" border=0></a>'  
 
leftrightslide[1]='<a href="images/image02.jpg" target="_blank"><img src="images/thumb02.jpg" border=0></a>'  
 
leftrightslide[2]='<a href="images/image03.jpg" target="_blank"><img src="images/thumb03.jpg" border=0></a>'  
...
..
leftrightslide[10]='<a href....etc..... </a>'

n°1336787
nargy
Posté le 01-04-2006 à 00:29:37  profilanswer
 

ouais ouais, faut que tu change la structure de ton code, pour prendre en compte les images numérotés.

n°1336806
xolth
Ranx.. znort!
Posté le 01-04-2006 à 01:44:13  profilanswer
 

pas obligé, si nomme les images image01.jpg, image02.jpg, image03.jpg, etc jusqu'à 10
 
Dans le script, je teste si l'image01 existe; Si elle existe l'image se définit, sinon, elle ne se définit pas et on passe à la ligne suivante;
Je teste si l'image02 existe; Si elle existe l'image se définit,
sinon, elle ne se définit pas et on passe à la ligne suivante;
Et ainsi de suite jusqu'à image10
 
En code ça donne:
 
var img0=new Image();
img0.src="thumb01.jpg";
if(img0.complete) {
leftrightslide[0]='<a href="images/image01.jpg" target="_blank"><img src="images/thumb01.jpg" border=0></a>';
}
var img1=new Image();
img1.src="thumb02.jpg";
if(img1.complete) {
leftrightslide[1]='<a href="images/image02.jpg" target="_blank"><img src="images/thumb02.jpg" border=0></a>';
}
 
Ca marche nickel!!!
Mille merci pour votre précieuse aide.


Message édité par xolth le 01-04-2006 à 04:45:39
n°1336809
nargy
Posté le 01-04-2006 à 01:49:56  profilanswer
 

img.complete
indique uniquement si le téléchargement est terminé, et je suis pas sûr que ça marche ou pas avec les liens cassés. Même si ça marche, il va falloir que tu ruse.
 
sinon pas de fautes de syntaxe... pour vérifier, utilise la console javascript de ton navigateur.
 

n°1336811
nargy
Posté le 01-04-2006 à 01:54:32  profilanswer
 

PS: tu connais ``for``? ça permet de faire des boucles:


var maximages=10;
 
for(i=1; i<=maximages; i++)
{
  var nomimage='image'+i+'.jpg';
  var img=new Image();
  img.src=nomimage;
  if(img.complete) {
    leftrightslide[0]='<a href="images/'+nomimage+'" target="_blank"><img src="images/thumb'+i+'.jpg" border=0></a>';
  }
}


par contre les images sont numérotés:
image1.jpg, image2.jpg, image3.jpg, image4.jpg, image5.jpg, image6.jpg, image7.jpg, image8.jpg, image9.jpg, image10.jpg


Message édité par nargy le 01-04-2006 à 01:56:02
n°1336822
xolth
Ranx.. znort!
Posté le 01-04-2006 à 03:05:54  profilanswer
 

Merci pour la boucle!!
Par contre, dans mon message plus haut, le script est faux.
J'ai essayé de faire des bricolettes avec la boucle pour y arriver, mais ça foire..
Sinon le script marche super bien, je le met tel quel, si tu veux bien le finaliser en mettant une boucle qui fonctionne!!
 
Le script:
Mettre cette ligne dans la page web, à l'endroit voulu:
<SCRIPT Language="JavaScript" type="text/javascript" SRC="images/slideshow/scroll.js"></SCRIPT>
Faire un fichier texte nommé scroll.js contenant:
var leftrightslide=new Array()
var finalslide=''
//SPECIFIER LES IMAGES:

var img0=new Image();  
img0.src="images/slideshow/_image1.jpg";  
if(img0.complete) {  
leftrightslide[0]='<a href="images/slideshow/image1.jpg" target="_blank"><img src="images/slideshow/_image1.jpg" border=0></a>';  
}
 
var img1=new Image();  
img1.src="images/slideshow/_image2.jpg";  
if(img1.complete) {  
leftrightslide[1]='<a href="images/slideshow/image2.jpg" target="_blank"><img src="images/slideshow/_image2.jpg" border=0></a>';  
}
 
var img2=new Image();  
img2.src="images/slideshow/_image3.jpg";  
if(img2.complete) {  
leftrightslide[2]='<a href="images/slideshow/image3.jpg" target="_blank"><img src="images/slideshow/_image3.jpg" border=0></a>';  
}
 
var img3=new Image();  
img3.src="images/slideshow/_image4.jpg";  
if(img3.complete) {  
leftrightslide[3]='<a href="images/slideshow/image4.jpg" target="_blank"><img src="images/slideshow/_image4.jpg" border=0></a>';  
}
 
var img4=new Image();  
img4.src="images/slideshow/_image5.jpg";  
if(img4.complete) {  
leftrightslide[4]='<a href="images/slideshow/image5.jpg" target="_blank"><img src="images/slideshow/_image5.jpg" border=0></a>';  
}
 
var img5=new Image();  
img5.src="images/slideshow/_image6.jpg";  
if(img5.complete) {  
leftrightslide[5]='<a href="images/slideshow/image6.jpg" target="_blank"><img src="images/slideshow/_image6.jpg" border=0></a>';  
}
 
var img6=new Image();  
img6.src="images/slideshow/_image7.jpg";  
if(img6.complete) {  
leftrightslide[6]='<a href="images/slideshow/image7.jpg" target="_blank"><img src="images/slideshow/_image7.jpg" border=0></a>';  
}
 
var img7=new Image();  
img7.src="images/slideshow/_image8.jpg";  
if(img7.complete) {  
leftrightslide[7]='<a href="images/slideshow/image8.jpg" target="_blank"><img src="images/slideshow/_image8.jpg" border=0></a>';  
}
 
var img8=new Image();  
img8.src="images/slideshow/_image9.jpg";  
if(img8.complete) {  
leftrightslide[8]='<a href="images/slideshow/image9.jpg" target="_blank"><img src="images/slideshow/_image9.jpg" border=0></a>';  
}
 
var img9=new Image();  
img9.src="images/slideshow/_image10.jpg";  
if(img9.complete) {  
leftrightslide[9]='<a href="images/slideshow/image10.jpg" target="_blank"><img src="images/slideshow/_image10.jpg" border=0></a>';  
}

//PARAMETRES
//Largeur
var sliderwidth="400px"
//Hauteur
var sliderheight="129px"
//Vitesse
var slidespeed=2
//couleur de fond:
slidebgcolor="#013264"
//Espace entre chaque image: (HTML)
var imagegap=" "
//Espace entre chaque fin/début de scroll (pixels)
var slideshowgap=2
 
////NE PLUS RIEN TOUCHER A PARTIR D ICI////////////
var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide
function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2" ) : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3" ) : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp" ).offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup
function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"
if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"
}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap
if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}
if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}


Message édité par xolth le 01-04-2006 à 04:51:51
n°1336840
nargy
Posté le 01-04-2006 à 09:09:26  profilanswer
 

> Sinon le script marche super bien, je le met tel quel, si tu veux bien le finaliser en mettant une boucle qui fonctionne!!
 
Ola! tu te débrouille, ça te fera un exercice. Je t ai donné déjà un exemple.

n°1336987
xolth
Ranx.. znort!
Posté le 01-04-2006 à 15:26:23  profilanswer
 

non, pour moi ça va comme ça, vu que j'ai décomposé en faisant dix blocs au lieu d'une boucle.
Si je te demandais ça, c'était pour que ça soit clean, et surtout ça parceque ça a l'air facile pour toi. Mais tel quel ça fonctionne.
J'ai essayé de le faire tout seul, mais je bloque sur l'incrémentation du nom de la variable imgX et sur l'incrémentation de l'array leftrightside[X].

n°1337004
nargy
Posté le 01-04-2006 à 15:57:47  profilanswer
 

ha oui, je l avais oublié le leftrightside[X] dans le code précédent.
 
une boucle c est hyper simple:

Code :
  1. for(  initialisation  ;  condition pour rester  ;  passer au tour suivant  )
  2.   blablabla


 
je reposte:


var maximages=10;
 
for(i=1; i<=maximages; i++)
{
  var nomimage='image'+i+'.jpg';
  var nomthumb='_image'+i+'.jpg';
  var img=new Image();
  img.src=nomimage;
  if(img.complete) {
    leftrightslide[i]='<a href="'+nomimage+'" target="_blank"><img src="'+nomthumb+'" border=0></a>';
  }
}


 
mais as tu essayé img.complete pour voir si ça marche comme je le suppose?

n°1337052
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:22:44  profilanswer
 

oui, img.complete marche!
Je croyais que je devais défnir une variable img par bloc. d'où le img1, img2,...img10
leftrightslide[i] doit commencer par la valeur zéro:
Esct-ce que je peux écrire leftrightslide[i-1] ou bien je dois faire:
var j=i-1
leftrighslide[j]
?
Autre chose: si je mets du script (n'importe lequel) dans mes balises head, hé bien mon slide ne s'affiche plus du tout! je n'arrive pas à comprendre pourquoi!!

n°1337058
nargy
Posté le 01-04-2006 à 17:29:39  profilanswer
 

> Esct-ce que je peux écrire leftrightslide[i-1]
oui
 
> Autre chose: si je mets du script (n'importe lequel) dans mes balises head, hé bien mon slide ne s'affiche plus du tout! je n'arrive pas à comprendre pourquoi!!
 
surement parceque document.write écrit alors dans le head!

n°1337059
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:32:43  profilanswer
 

Ca me donne ça:

Citation :


var maximages=10;  
   
for(i=1; i<=maximages; i++)  
{  
  var nomimage='images/slideshow/image'+i+'.jpg';  
  var nomthumb='images/slideshow/_image'+i+'.jpg';
  var j=i-1
  var img=new Image();  
  img.src=nomimage;  
  if(img.complete) {  
    leftrightslide[j]='<a href="'+nomimage+'" target="_blank"><img src="'+nomthumb+'" border=0></a>';  
  }  
}  


 
Mais ça ne marche pas. Pourtant ie ne me renvoie pas d'erreur.

n°1337061
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:37:04  profilanswer
 

ok ca marche
 

Citation :


var maximages=10;  
   
for(i=1; i<=maximages; i++)  
{  
  var nomimage='images/slideshow/image'+i+'.jpg';  
  var nomthumb='images/slideshow/_image'+i+'.jpg';
  var img=new Image();  
  img.src=nomthumb;  
  if(img.complete) {  
    leftrightslide[i-1]='<a href="'+nomimage+'" target="_blank"><img src="'+nomthumb+'" border=0></a>';  
  }  
}  


Message édité par xolth le 01-04-2006 à 17:42:32
n°1337062
nargy
Posté le 01-04-2006 à 17:39:52  profilanswer
 

rajoute un peu de debug pour y voir plus clair:


var maximages=10;  
   
for(i=1; i<=maximages; i++)  
{  
document.write('TEST:image: '+i);
  var nomimage='images/slideshow/image'+i+'.jpg';  
  var nomthumb='images/slideshow/_image'+i+'.jpg';
  var j=i-1
  var img=new Image();  
  img.src=nomimage;  
  if(img.complete) {  
    leftrightslide[j]='<a href="'+nomimage+'" target="_blank"><img src="'+nomthumb+'" border=0></a>';  
document.write('TEST:'+leftrightslide[j]);
  }  
else
document.write('TEST: IMAGE '+i+' PAS COMPLETE!?');
}


n°1337063
nargy
Posté le 01-04-2006 à 17:40:07  profilanswer
 

ok dac

n°1337064
nargy
Posté le 01-04-2006 à 17:42:14  profilanswer
 

si tu veux plus d images, tu peut changer:
var maximages=10;
par exemple:
var maximages=50;

n°1337066
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:45:40  profilanswer
 

of course!! c'est génial, à part le fait que si je veux que ça marche, mon head doit etre vierge.
A part refaire mon site en frames, je vois pas comment faire


Message édité par xolth le 01-04-2006 à 17:46:09
n°1337071
nargy
Posté le 01-04-2006 à 17:48:54  profilanswer
 

ben mets plutot le script dans le body.
ou découpe le en deux morceaux, avec le write dans le body, et les précharge/vérif dans le head.
et mets le JS à part dans un fichier.js ;)

n°1337072
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:50:10  profilanswer
 

Tu m'as beaucoup aidé. Vraiment merci!!
Je vais arreter de te solliciter si tu veux, et refaire un nouveau post pour demander pourquoi et comment je peux résoudre ce dernier pb.
 
Je remettrais ici le code fini tout beau pour ceux que ça intéresse.
Il est bien ce script parceque lorsqu'on met la souris sur le slide, il s'arrete de défiler pour qu'on ait le temps de bien regarder la photo et cliquer dessus si on veut voir la foto en grand.

n°1337074
xolth
Ranx.. znort!
Posté le 01-04-2006 à 17:52:51  profilanswer
 

pour le .js c'est deja comme ça que ça marchait, et le script était dans le body.
Je vais essayer de le couper en deux pour voir comment ça se comporte.

n°1337075
nargy
Posté le 01-04-2006 à 17:54:27  profilanswer
 

ça prends deux secondes les modifs, juste un peu de copier/coller.
 
dans un premier temps tu mets tout le script dans le body et ça devrait aller.
 
si ça marche pas c est parceque document.write écrit juste après la balise <script>, donc si <script> est dans le <head> il écrit dans le <head> et ça fait tout foirer.

n°1337076
nargy
Posté le 01-04-2006 à 17:55:15  profilanswer
 

quand tu met le script dans le body, il écrit dans le body et ça devrait aller.

n°1337122
xolth
Ranx.. znort!
Posté le 01-04-2006 à 20:24:16  profilanswer
 

Bon, appamment, le problème viendrait du test img.complete
Je ne suis pas sûr que ça soit la bonne méthode.
En fait pour tester, j'avais toujours la meme page ouverte et je rafraichissait.
Mais quand j'ouvre le fichier, aucune image ne s'affiche tant que je n'ai pas fait un refresh de la page

n°1337124
nargy
Posté le 01-04-2006 à 20:27:39  profilanswer
 

ha ouais
ben tu devra ruser avec setInterval

n°1337126
nargy
Posté le 01-04-2006 à 20:29:15  profilanswer
 

et avec createElement, getElementById, appendChild, innerHTML

n°1337128
nargy
Posté le 01-04-2006 à 20:31:25  profilanswer
 

si j ai le temps, je te fais un truc de la mort kitu, mais pas pour l instant

n°1337129
xolth
Ranx.. znort!
Posté le 01-04-2006 à 20:35:44  profilanswer
 

ok, merci pour tout ce que tu as deja fait.
Je met le contenu du .js tel qu'il est dans l'état actuel.

Citation :


var leftrightslide=new Array()
var img=new Array()
var finalslide=''
 
//SPECIFIER LES IMAGES:
//DEBUT
 
var maximages=10;  
 
for(i=1; i<=maximages; i++)  
{  
  var nomimage='images/slideshow/image'+i+'.jpg';  
  var nomthumb='images/slideshow/_image'+i+'.jpg';
  img[i-1]=new Image();  
  img[i-1].src=nomthumb;  
  if(img[i-1].complete) {  
    leftrightslide[i-1]='<a href="'+nomimage+'" target="_blank"><img src="'+nomthumb+'" border=0></a>';  
  }  
}  
//FIN
 
 
//Largeur
var sliderwidth="400px"
//Hauteur
var sliderheight="129px"
//Vitesse
var slidespeed=2
//couleur de fond:
slidebgcolor="#013264"
//Espace entre chaque image: (HTML)
var imagegap=" "
//Espace entre chaque fin/début de scroll (pixels)
var slideshowgap=2
 
 
////NE PLUS RIEN TOUCHER A PARTIR D ICI////////////
 
var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide
 
function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2" ) : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3" ) : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp" ).offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup
 
function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"
 
if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"
 
}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap
 
if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}
 
 
if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}


Message édité par xolth le 02-04-2006 à 02:28:43
n°1337158
nargy
Posté le 01-04-2006 à 21:43:47  profilanswer
 

olala ça bugge.
tu a oublié plein de ``;``, et ceux que tu a mis ne sont pas à la bonne place.
 
le ``img.complete`` ne marche pas du tout, en fait.
 
je viens de piger ce que tu voulais faire.
 
j ai mis un script de défilement de news qui peut faire le même genre de trucs, il marche sous FF+IE+Opera, en plus il sroll un background et est redimessionnable. tu le trouvera en cherchant sur le forum, si ça t interesse, mais il faudra que tu l adapte pour lui faire afficher des images (il affiche du HTML).

mood
Publicité
Posté le   profilanswer
 

 Page :   1  2
Page Précédente

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [RESOLU] cherche script pour defilement de photos

 

Sujets relatifs
Faire un script shell sous Unix[Résolu] Un compteur de mots dans Word
Problème id dans création de tableau dynamique [résolu][resolu]Fonction sqrt non reconnue...
Bouton abandonner en javascript [RESOLU]Recherche Script pour afficher toutes les images d'un dossier !
[RESOLU] Comment dessiner une fenêtre?[Résolu] Vider le cache
Bloc Serveur comme nukeClan sur un site HTML [résolu][résolu][VBA]Afficher mon document Word
Plus de sujets relatifs à : [RESOLU] cherche script pour defilement de photos


Copyright © 1997-2018 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR