Comment integrer ce script dans une page?

Résolu
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 - 7 oct. 2008 à 23:24
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 - 9 oct. 2008 à 20:01
salut,
l'auteur lui meme ne sait pas , et moi j'y connais que dalle en javascript, html ,...
http://www.javascriptfr.com/code.aspx?ID=48133

merci

Bonjour chez vous !
A voir également:

22 réponses

PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
8 oct. 2008 à 04:54
Bonjour,
le problème vient des %22 qu'il faut remplacer par des "
remplace les et colle le script à la fin de ton
fichier.

<html>

<head>
</head>

..TA PAGE...

<script type="text/javascript">
R = 0;
x1 = .1;
y1 = .05;

x2 = .25;
y2 = .24;
x3 = 1.6;
y3 = .24;
x4 = 300;
y4 =
200;
x5 = 300;
y5 = 200;
DI = document.getElementsByTagName( "img


"



);

DIL = DI.length;
function A() {
  for (i = 0; i - DIL; i++) {

    DIS = DI[i].style;
    DIS.position = 'absolute';
    DIS.left =
(Math.sin(R * x1 + i * x2 + x3) * x4 + x5) +



"



px



"



;
    DIS.top  = (Math.cos(R
* y1 + i * y2 + y3) * y4 + y5) +



"



px



"



;
  }
  R++
}

setInterval('A()', 50);
</script>


</html>



;O)
3
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
8 oct. 2008 à 10:57
<





body





onload


"document.location.href'javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName(%22img%22); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position=\'absolute\'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+%22px%22; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+%22px%22}R++}setInterval(\'A()\',50); void(0);'">














Bonjour chez vous !
3
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 oct. 2008 à 18:48
tiens juste pour le FUN
essaies cela...



<html>
<head>
<style type= "text/css">
.move
{
  color : red;
  border : 1px solid red;
  font-size : 18px;

  font-weigth : bold;
  height : 20px;
  width : 20px;

  text-align : center;
  background-color : #f0e0e0;
}

</style>
<script type="text/javascript">
var R = 0;

var x1 = .1;
var y1 = .05;
var x2 = .25;
var y2 = .24;
var
x3 = 1.6;
var y3 = .24;
var x4 = 300;
var y4 = 200;
var x5 =
300;
var y5 = 200;
//-- Tableau des images a
mover
var T_Img =[];
//-----------------------
function
Init_Animation(){
  //-- Recup de toutes les images
de la page
  T_Div = document.getElementsByTagName('DIV')

  for ( i = 0; i < T_Div.length; i++){
    //-- Ne garde que celles possedant la class move

    if( T_Div[i].className.indexOf("move") > -1){

      T_Img[T_Img.length] = T_Div[i];
    }
  }
  //-- lance la fonction du move

  setInterval('A()', 50);
}
//----------
function A(){
  var Nbr =
T_Img.length;
  for (i = 0; i < Nbr; i++) {
    with(
T_Img[i].style){
      position = 'absolute';
      left = (Math.sin(R *
x1 + i * x2 + x3) * x4 + x5) + "px";
      top = (Math.cos(R * y1 + i * y2 +
y3) * y4 + y5) + "px";
    }
  }
  R++;
}
</script>

</head>

<script
type="text/javascript">





  //-- Creation des images lettres






  var szLettre = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

  var Html = "";
  for( i = 0; i < szLettre.length; i++){

    Html += "
" +szLettre.charAt(i) +"
"

  }
  document.write( Html);
</script>


</html>
3
coucou747 Messages postés 12303 Date d'inscription mardi 10 février 2004 Statut Membre Dernière intervention 30 juillet 2012 44
8 oct. 2008 à 00:15
salut
un truc comme ca devrait marcher :
[javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName('img'); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+%22px%22; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+%22px%22}R++}setInterval('A()',50); void(0); clique ici]

bon courage
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
8 oct. 2008 à 00:20
merci coucou747
mais est ce qu'il y a moyen sans devoir cliquer sur un lien ??

Bonjour chez vous !
0
coucou747 Messages postés 12303 Date d'inscription mardi 10 février 2004 Statut Membre Dernière intervention 30 juillet 2012 44
8 oct. 2008 à 00:24
tu peux tenter des choses comme ca :
<script type="text/javascript">
window.onload = function(){ R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200;
x5=300; y5=200; DI=document.getElementsByTagName('img'); DIL=DI.length;
function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style;
DIS.position='absolute';
DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+%22px%22;
DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+%22px%22}R++}setInterval('A()',50); }
</script>
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
8 oct. 2008 à 00:37
ne fonctionne pas du tout

Bonjour chez vous !
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
8 oct. 2008 à 04:57
Copier coller hasardeux...
Attention pas d'espace avant le deuxième


"


dans cette ligne,


DI = document.getElementsByTagName( "img



"



);


et idem pour les



"



px



"



;







;O)
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
8 oct. 2008 à 05:01
décidément c'est l'éditeur qui m...e, si on met de la couleur !!!!!!!!!!!!

donc

DI =
document.getElementsByTagName( "img");
DIS.left = (Math.sin(R * x1 + i * x2
+ x3) * x4 + x5) + "px";
DIS.top = (Math.cos(R * y1 + i * y2 + y3) * y4 +
y5) + "px";

;O)
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
8 oct. 2008 à 11:05
est il possible de traiter une liste d'images (donc pas toutes)avec ce script ????

exemple :   j'ai une page avec 10 liens chaque lien est représenté par une image, mais j'ai d'autres images sur la page qui sont juste la pour faire joli
si je voulais juste mettre en mouvement les images liens,, ou même d'autres images qui ne sont pas sur la page est ce possible ??

Bonjour chez vous !
0
coucou747 Messages postés 12303 Date d'inscription mardi 10 février 2004 Statut Membre Dernière intervention 30 juillet 2012 44
8 oct. 2008 à 11:06
faut remplacer ca :
DI=document.getElementsByTagName(%22img%22);
par ton tableau d'images.
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
8 oct. 2008 à 11:23
ok mais comment je fais un tableau d'images???

( a.gif ,b.gif ) ????

Bonjour chez vous !
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 oct. 2008 à 17:31
Bonjour,
Attention le code, tel que présenté, est intérressant pour
jouer avec une page affichée dans le navigateur.

Cela va devenir dur de
tout mettre dans le onload du BODY, il vaut
mieux passer par une fonction indépendante.

Comme le dit coucou747 il te faut récupérer dans un tableau les
images que tu veux mover, à cela plusieurs méthodes, comme d'habitude, en voici
une...

- On utilise une class de style par exemple move pour
différentier les images, celles qui bougent et les autres.
- A partir de la
collection d'image de la page, document.images, on ne récupére que celle qui ont la
class move et on les empile dans un tableau, on utilise indexOf( "move") pour récupérer l'info.
-
Ensuite on lance la fonction d'animation
le onload du BODY
...
 
Exemple de code
<html>
<head>

<style type= "text/css">
img { border : 1px solid blue;}
.move
{ border : 1px solid red;}
</style>
<script
type="text/javascript">
var R = 0;
var x1 = .1;
var y1 = .05;

var x2 = .25;
var y2 = .24;
var x3 = 1.6;
var y3 = .24;
var
x4 = 300;
var y4 = 200;
var x5 = 300;
var y5 = 200;
//-- Tableau des images a mover
var T_Img =[];
// Equivalent a var T_Img = new Array();

//-----------------------

function Init_Animation(){
  //--
Recup de toutes les images de la page
  for ( i = 0; i <
document.images.length; i++){
    //-- Ne garde que
celles possedant la class move
    if(
document.images[i].className.indexOf("move") > -1){

      T_Img[T_Img.length] = document.images[i];
    }
  }

  //-- lance la fonction du move

  setInterval('A()', 50);
}
//----------
function A(){
  var Nbr =
T_Img.length;
  for (i = 0; i < Nbr; i++) {
    with(
T_Img[i].style){
      position = 'absolute';
      left = (Math.sin(R *
x1 + i * x2 + x3) * x4 + x5) + "px";
      top = (Math.cos(R * y1 + i * y2 +
y3) * y4 + y5) + "px";
    }
  }
  R++;
}
</script>

</head>











</html>

Nota : Cela risque de
détruire ta mise en page de départ...Wait and SEA
;O)
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
9 oct. 2008 à 18:05
non c'est ok c'était pour faire bouger toutes les lettres de l'alphabet dans une page qui sert à envoyer des mails mais j'ai éssayé et ça fait trop lourd

Bonjour chez vous !
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 oct. 2008 à 18:10
No blem, pour le FUN
tu pourrais ne faire valser que les lettres contenues dans le nom de
l'expéditeur...
;O))))
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
9 oct. 2008 à 18:17
ben la c'est pas des images je sais pas si ça serait possible de faire ça avec des caractères
j'ai l'impression d'avoir sous estimé javascript

Bonjour chez vous !
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 oct. 2008 à 18:35
pour le principe
On lit les lettres composants le
nom...
On charge, ou précharge, les images des lettres correspondantes...

On envoi la valse...
That's All Folks
!

nota: cela risque d'être long avec des images, mais
on peut faire la même chose avec des lettres dans des SPANs ou des DIVs

;O)
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
9 oct. 2008 à 19:01
WAOUW super cela permet de faire beaucoup mieux

merci pour ton aide

Bonjour chez vous !
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 oct. 2008 à 19:22
allez je te livre une version plus DOM
<html>
<head>

<style type= "text/css">
.move {
  color : red;
  border :
1px solid red;
  font-family : verdana;
  font-size : 18px;
  font-weigth : bold;
  height :
20px;
  width : 20px;
  text-align : center;
  background-color :
#f0e0e0;
}
</style>
<script type="text/javascript">

var R = 0;
var x1 = .1;
var y1 = .05;
var x2 = .25;
var y2 =
.24;
var x3 = 1.6;
var y3 = .24;
var x4 = 300;
var y4 = 200;

var x5 = 300;
var y5 = 200;
//-- Tableau des
images a mover
var T_Img =[];
//-----------------------
function
Init_Animation(){
  //-- La chaine de reference

  var szLettre = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
  //-- Creation des images Lettres
  for( i = 0; i
< szLettre.length; i++){
    var O_Div = document.createElement('DIV');

    O_Div.innerHTML = szLettre.charAt(i);
    O_Div.className = 'move';

    document.body.appendChild( O_Div);
    //--
stockage dans tableau
    T_Img[T_Img.length] = O_Div;
  }

  //-- lance la fonction du move

  setInterval('A()', 50);
}
//----------
function A(){
  var Nbr =
T_Img.length;
  for (i = 0; i < Nbr; i++) {
    with(
T_Img[i].style){
      position = 'absolute';
      left = (Math.sin(R *
x1 + i * x2 + x3) * x4 + x5) + "px";
      top = (Math.cos(R * y1 + i * y2 +
y3) * y4 + y5) + "px";
    }
  }
  R++;
}
</script>

</head>


</html>

c'est un peu plus classe...

Bon jeu
;O)
0
gillardg Messages postés 3275 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 14 septembre 2014 2
9 oct. 2008 à 19:34
désolé mais je n'y vois aucune différence à l'éxécution

Bonjour chez vous !
0
Rejoignez-nous