begin process at 2012 02 14 12:41:11
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript Orienté objet (POO)

 > 

Function & Méthodes

 > 

explication d'un script


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

explication d'un script

vendredi 5 septembre 2008 à 08:59:11 | explication d'un script

cyclopdev

Bonjour à tous,

J'espère que je poste dans la bonne section.
Voici mon souci : je cherche à dapter le scrit suivant à mes besoins :
http://www.codes-sources.com/code.aspx?ID=42611

Malheureusement, je ne connais pas javascript, et le code n'est pas commenté, j'aurais donc besoin de votre aide pour d'une part me dire si je suis sur la bonne voie, et d'autre part m'expliquer les points que je ne comprends pas.

code :
var visuel_n=0;

function Visuel_Fondu()

{

if(document.all)

{

if ( window.opera )

document.getElementById("visuel_" + VisuelPosChange).style.opacity = visuel_n*0.01;

else

document.getElementById("visuel_" + VisuelPosChange).filters.alpha.opacity=visuel_n;

visuel_n+=5;

if ( visuel_n<= 100 )

{

setTimeout("Visuel_Fondu()", 100);

return 0;

}

}

else

{

document.getElementById("visuel_" + VisuelPosChange).style.setProperty("-moz-opacity", visuel_n, "");

visuel_n+=0.05;

if ( visuel_n<= 1 )

{

setTimeout("Visuel_Fondu()", 100);

return 0;

}

}

visuel_n=0;

document.getElementById("visuel").style.background="url('" + VisuelTab[VisuelPosChange][0] + "') -4px 0px no-repeat";

setTimeout("Visuel_Clear()", 100); //supprime clignotement sous FF

}

Cette partie du code si je ne m'abuse est la fonction de fondu entre les images, avec un genre de test pour la compatibilité des différents navigateurs, et une durée de fondu de 5 secondes ici. c'est bien ça ?

on continue, code :
function Visuel_Clear()

{

document.getElementById("visuel").innerHTML="";

setTimeout("Visuel_Defil()", 4000);

}

Ici, c'est la fonction qui efface la première immage du fondu ?

code :
var VisuelTab = [

["visuel_2.jpg",0],

["visuel_3.jpg",0],

["visuel_4.jpg",0],

["visuel_5.jpg",0],

["visuel_1.jpg",0],

];

Là c'est la création du tableau qui contient les noms des photos. D'après les différents crochets, je dirais que c'est un tableau à entrée multiple, ets-ce indispensable ? Ne peut-on faire ça avec un tableau simple ? A quoi correspond la valeur "0", sachant qu'elle revient systématiquement, ne peut-on la passer en paramètre ailleurs ? Je souhaiterais générer le tableau à partir d'un array php qui contient ma liste de photos, seulement mon array est linéaire, donc j'aimerais comprendre la nécéssité de ce "0", et d'avoir un tableau à entrée multiple.

on continue, code :
var VisuelPos=-1;

var VisuelPosChange;

function Visuel_Defil()

{

VisuelPosChange=VisuelPos;

VisuelPos++;

if ( VisuelTab.length <= VisuelPos )

VisuelPos=0;



if ( VisuelTab[VisuelPosChange][1] == 1 )

document.getElementById("visuel").innerHTML+="<img src='" + VisuelTab[VisuelPosChange][0] + "' id='visuel_" + VisuelPosChange + "' style='filter:alpha(opacity=0); -moz-opacity:0; position: absolute; margin-left: -4px;' />";

else

{

setTimeout("Visuel_Defil()", 10);

return 0;

}

Visuel_Fondu();

}
Ca c'est la fonction de défilement des images, on prend la première valeur du tableau, puis on incrémente pour passer à la suivante, etc... J'ai bon ?
Si je veux un affichage aléatoire, c'est ici que je dois caser un genre de random sur la variable VisuelPos ?

ensuite, code :
LoadVisuel();

function LoadVisuel() {

var tonimage=new Array();



for ( LoadVisuelPos=0;LoadVisuelPos<VisuelTab.length;LoadVisuelPos++)

{

tonimage[LoadVisuelPos] = new Image();

tonimage[LoadVisuelPos].src = VisuelTab[LoadVisuelPos][0];

//tonimage[LoadVisuelPos].onload = eval("function() { JsIsLoading("+LoadVisuelPos+"); }");

tonimage[LoadVisuelPos].onload =  eval("JsIsLoading("+LoadVisuelPos+");");

}

}
on affiche l'image ?

code :
function JsIsLoading(LoadVisuelPos_) {

VisuelTab[LoadVisuelPos_][1]++;

if ( VisuelPos==-1 )

{

VisuelPos=0;

Visuel_Defil();

}

}
on charge l'image ? en cache ?

Tout ça reste un peu flou, je ne vois pas à quel moment et de quelle façon l'image est affichée, et surtout, je ne comprend pas la nécéssité du tableau multiple avec cette valeur "0".

Merci donc à ceux qui pourront m'éclairer.
vendredi 5 septembre 2008 à 10:17:09 | Re : explication d'un script

bizibiz17

Salut, c'est cette ligne qui affiche l'image : document.getElementById("visuel").innerHTML+="";
vendredi 5 septembre 2008 à 10:19:05 | Re : explication d'un script

bizibiz17

Et m*****
Donc c'est cette ligne qui affiche les images :
document.getElementById("visuel").innerHTML+="<img src='" + VisuelTab[VisuelPosChange][0] + "' id='visuel_" + VisuelPosChange + "' style='filter:alpha(opacity=0); -moz-opacity:0; position: absolute; margin-left: -4px;' />";
vendredi 5 septembre 2008 à 10:22:20 | Re : explication d'un script

bizibiz17

Et cette ligne là rend visible l'image en augmentant son opacité :
document.getElementById("visuel_" + VisuelPosChange).filters.alpha.opacity=visuel_n;

ps : la ligne est différente en fonction du navigateur
vendredi 5 septembre 2008 à 12:10:42 | Re : explication d'un script

cyclopdev

bonjour bizibiz17, merci pour tes explications.

la partie de ce script qui m'intéresse maintenant est la méthode de défilement des images (passage d'une image à l'autre)
ici les images sont définies en "dur" dans un tableau avec a chaque image un attribut supplémentaire : "0" ca serait cgrâce à cet attribut que l'on procède au passage d'une image à l'autre (avec VisuelPosChange et VisuelPos) ?

dans l'idée où je veux d'une part avoir un affichage aléatoire, et d'autre part récupérer automatiquement ma liste de fichiers (à partir d'un array php issu d'un scan du dossier), je dois pouvoir à la fois me passer de "l'attribut" 0 qui est présent dans chaque entrées du tableau et de VisuelPosChange (en utilisant rand ou srand, je ne sais pas trop), non ?
vendredi 5 septembre 2008 à 13:21:41 | Re : explication d'un script

kazma

Administrateur CodeS-SourceS
bonjour
exemple d'un script sans l'opacite pour changer une image aleatoirement concu por huit images

<html>
<head>
<script>
function defilmage(){
ima = Math.floor(Math.random() * 8)
document.getElementById('divimage').src = ima+".jpg"
setTimeout("defilmage()",2000)
}
</script>
</head>
<body onload=defilmage()>
<img id='divimage' src=1.jpg>
</body>
</html>
vendredi 5 septembre 2008 à 13:34:45 | Re : explication d'un script

cyclopdev

alors pour le tirage aléatoire, j'ai remplacé :
j'ai ajouté la variable :
var nb=VisuelTab.length;

ensuite dans la fonction Visuel_defil, j'ai remplacé l'incrémentation de visuel pos (VisuelPos++;) par : VisuelPos= Math.floor(Math.random() * nb);

et j'ai viré le contrôle de la valeur de VisuelPos devenu inutile
if ( VisuelTab.length <= VisuelPos )

VisuelPos=0;


ce qui donne (pour la fonction Visuel_Defil) :

var VisuelPos=-1;

var VisuelPosChange;
var nb=VisuelTab.length;

function Visuel_Defil()

{

VisuelPosChange=VisuelPos;

VisuelPos= Math.floor(Math.random() * nb);



if ( VisuelTab[VisuelPosChange][1] == 1 )

document.getElementById("visuel").innerHTML+="<img src='" + VisuelTab[VisuelPosChange][0] + "' id='visuel_" + VisuelPosChange + "' style='filter:alpha(opacity=0); -moz-opacity:0; position: absolute; margin-left: -4px;' />";

else

{

setTimeout("Visuel_Defil()", 10);

return 0;

}

Visuel_Fondu();

}

ça a l'air de marcher.

il me reste plus qu'à voir mon histoire de tableau
vendredi 5 septembre 2008 à 17:12:29 | Re : explication d'un script

cyclopdev

pour le tableau, j'ai écrit un script php qui scan mes repertoires de photos, et qui génère un tableau de la même forme que celui du script javascript.

$dir_nom = './photos';
$dir = opendir($dir_nom) or die('repertoire introuvable');
$gal= array();
while($element = readdir($dir))
{
if($element != '.' && $element != '..')
{
$gal[] = $element;
}
}
closedir($dir);
$nb_gal = count($gal)-1;
if(!empty($gal))
{
$photo= array();
$tableau= array();
for ($num_gal =0;$num_gal<=$nb_gal;$num_gal++)
{
$nom_gal = $gal[$num_gal] ;
$gal_nom = './photos/'.$nom_gal;
$gal_dir = opendir($gal_nom) or die('repertoire introuvable');
while($tof = readdir($gal_dir))
{
if($tof != '.' && $tof != '..')
{
$photo[] = './photos/'.$nom_gal.'/'.$tof;
$photo[] = 0;
$tableau[] = $photo;
$photo= array();
}
}
closedir($gal_dir);
}
}

ensuite j'exporte mon tableau en javascript

et tout roule, j'ai enfin mon diaporama automatique aléatoire avec fondu qui se met à jour tout seul (juste à uploader un nouveau dossier de photos) \o/

merci à tous (dédicace à guillaume si tu passes par là)


Cette discussion est classée dans : function, code, visuel, loadvisuelpos, tonimage


Répondre à ce message

Sujets en rapport avec ce message

le javascript... [ par fubullrot31305 ] salut tout le monde ! voila, j'ai trouver ceci en prenant le code source d'une page :     & Qui veut gagner des millions ?! [ par Stark ] GeneralStarkHello,Voilà la question à 1'000'000.... Est-il possible de réactiver un composant après qu'on l'ai désactivé avec javascript document.write() depuis 1 function [ par alonsyl ] bonjour,par l'intermediaire d'une de mes "function" de mon j'actualise le contenu d'un  via la commande suivante : document.monForm.monInput.value = Ajax/Javascript [ par sagaff ] J'ai un problème avec ce code: Cod recupérer le code html d'une selection [ par caviar ] Saluté ! j'ai un petit pb tout bête ...j'aimerai récupérer le code html selectionné lorsqu'un utilisateur fait un surlignage sur ma page ...par exempl function non exécutée après contrôle de formulaire [ par cousinlol ] Bonjour, Juste un p'tit truc qui m'échappe J'ai un formulaire, sur lequel je fais un petit contrôle : <table align="center" border="0" cellpaddin menu js qui se deplie automatiquement [ par oceane751 ] bonjourj'ai un code qui sur simple clique me delie des sous menule hic est que les sous menus sont automatiquement depliés, alors qu'il faudrait le de Connaitre la fin d'une fonction [ par Angelblade ] Bonjour à tous, je vais essayer de vous expliquer mon souci ^^'.Je veux pouvoir répéter une portion de code tous les X ms et une fois que le code a ét importation de fonction javascript dans un autra fichier javascript [ par benarroud ] Bonjour, J'ai des fonctions javascript (objet) présent dans un fichier. je voudrais appeler ces fonctions  a partir d'un autre fichier javascript. Génération des champs select et input dynamique / Listes liées [ par daris ] Bonjour;J'essaie de générer deux(2) listes liées et aussi des input dynamiquement avec ajax et javascript mais dure dure...Mon code ne marche pas norm


Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,952 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales