Redimensionnement frames animé

Résolu
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008 - 21 oct. 2007 à 14:11
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008 - 30 mai 2008 à 10:51
bonjour a tous ,

jai réalisé un site  ( www.google-enhanced.com )
sur lequel le redimmensionnement des frames est indispensable , jutilise cette fonction:

function Frame_resizor1()
    {
    window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px";
    }
function Frame_resizor2()
    {
    etcetc...
    }
-----
fonction appelée par un "[javascript:Frame_resizor1() aaa]
-----
le
redimensionnement se fait de facon brutale , jaimerais bien pouvoir
l'animé (facon "redimensionnement manuel), jai cherché comme un fou
sur le net , mais je nai pas trouver de début de source (sauf sur ce
site >
http://www.javascriptfr.com/codes/PETITES-FONCTIONS-POUR-GERER-VOS-FRAME-FRAMES_24418.aspx
< mais la source ne fonctionne plus , trop ancinne peut etre)...

<merci></merci>

18 réponses

cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 13:22
trouvé!!

<sscript>
function Frame_resizor1a()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 0px";
    }
    function Frame_resizor1b()
    {
    window.parent.document.body.rows="30px, 60% ,33px, 40%, 0px";
    }
    function Frame_resizor1c()
    {
    window.parent.document.body.rows="30px, 70% ,33px, 30%, 0px";
    }
    function Frame_resizor1d()
    {
    window.parent.document.body.rows="30px, 80% ,33px, 20%, 0px";
    }
    function Frame_resizor1e()
    {
    window.parent.document.body.rows="30px, 90% ,33px, 10%, 0px";
    }
    function Frame_resizor1f()
    {
    window.parent.document.body.rows="30px, 95% ,33px, 5%, 0px";
    }
    function Frame_resizor1z()
    {
    window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px";
    }
   
   
   
   
   
   
function Frame_resizor2a()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 0px";
    }
    function Frame_resizor2b()
    {
    window.parent.document.body.rows="30px, 40% ,33px, 60%, 0px";
    }
        function Frame_resizor2c()
    {
    window.parent.document.body.rows="30px, 30% ,33px, 70%, 0px";
    }
        function Frame_resizor2d()
    {
    window.parent.document.body.rows="30px, 20% ,33px, 80%, 0px";
    }
        function Frame_resizor2e()
    {
    window.parent.document.body.rows="30px, 10% ,33px, 90%, 0px";
    }
            function Frame_resizor2f()
    {
    window.parent.document.body.rows="30px, 5% ,33px, 95%, 0px";
    }
    function Frame_resizor2z()
    {
    window.parent.document.body.rows="30px, 0% ,33px, 100%, 0px";
    }
   
   
   
   
   
   
   
    function Frame_resizor3aa()
    {
    window.parent.document.body.rows="30px, 85% ,33px, 15%, 22px"
    }   
    function Frame_resizor3a()
    {
    window.parent.document.body.rows="30px, 75% ,33px, 25%, 22px"
    }
        function Frame_resizor3b()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 35%, 22px"
    }
        function Frame_resizor3c()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 45%, 22px"
    }
        function Frame_resizor3d()
    {
    window.parent.document.body.rows="30px, 45% ,33px, 55%, 22px"
    }
        function Frame_resizor3e()
    {
    window.parent.document.body.rows="30px, 35% ,33px, 65%, 22px"
    }
        function Frame_resizor3f()
    {
    window.parent.document.body.rows="30px, 25% ,33px, 75%, 22px"
    }
    function Frame_resizor3g()
    {
    window.parent.document.body.rows="30px, 15% ,33px, 85%, 22px"
    }
    function Frame_resizor3h()
    {
    window.parent.document.body.rows="30px, 35% ,33px, 75%, 22px"
    }
        function Frame_resizor3i()
    {
    window.parent.document.body.rows="30px, 45% ,33px, 65%, 22px"
    }
        function Frame_resizor3j()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 55%, 22px"
    }
            function Frame_resizor3k()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 45%, 22px"
    }
                function Frame_resizor3l()
    {
    window.parent.document.body.rows="30px, 75% ,33px, 35%, 22px"
    }
                function Frame_resizor3m()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 45%, 22px"
    }
            function Frame_resizor3n()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 55%, 22px"
    }
        function Frame_resizor3z()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 22px"
    }
 function Test1(){
  setTimeout("Frame_resizor1a()", 0);
    setTimeout("Frame_resizor1b()", 40);
      setTimeout("Frame_resizor1c()", 70);
        setTimeout("Frame_resizor1d()", 100);
         setTimeout("Frame_resizor1e()", 130);
          setTimeout("Frame_resizor1f()", 160);
 setTimeout("Frame_resizor1z()", 190);
 }
  function Test2(){
  setTimeout("Frame_resizor2a()", 0);
    setTimeout("Frame_resizor2b()", 40);
      setTimeout("Frame_resizor2c()", 70);
        setTimeout("Frame_resizor2d()", 100);
         setTimeout("Frame_resizor2e()", 130);
          setTimeout("Frame_resizor2f()", 160);
 setTimeout("Frame_resizor2z()", 190);
 }
   function Test3(){
  setTimeout("Frame_resizor3a()", 0);
    setTimeout("Frame_resizor3aa()", 50);
    setTimeout("Frame_resizor3b()", 100);
      setTimeout("Frame_resizor3c()", 150);
        setTimeout("Frame_resizor3d()", 200);
         setTimeout("Frame_resizor3e()", 250);
           setTimeout("Frame_resizor3f()", 300);
            setTimeout("Frame_resizor3g()", 350);
             setTimeout("Frame_resizor3h()", 400);
             setTimeout("Frame_resizor3i()", 450);
             setTimeout("Frame_resizor3j()", 500);
             setTimeout("Frame_resizor3k()", 550);
             setTimeout("Frame_resizor3l()", 600);
             setTimeout("Frame_resizor3m()", 650);
             setTimeout("Frame_resizor3n()", 700);
 setTimeout("Frame_resizor3z()",750);
 }
</SCRIPT>

résultat ici > www.google-enhanced.com
3
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
21 oct. 2007 à 14:20
peut etre en faisant une décomposition du mouvement , mais je nais aucune idée de comment codé sa

exemple illustrant ma pensée:
position avt click > "30px, 100% ,33px, 0%, 0px";
clik
puis a 0.1 sec (apres click) > "30px, 90% ,03px, 10%, 0px";
puis a 0.2 sec > "30px, 80% ,03px, 20%, 10px";
.....
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
21 oct. 2007 à 15:06
je ne peux que répéter ce que j'ai dis là :
http://www.javascriptfr.com/infomsg_REDIMESIONNEMENT-FRAMES-ANNIME_1024283.aspx#3
d'autres intervenants comprendront sans doute mieux ?

encore une fois, tu parles de frame et tu montres un pop-up
( j'ai d'ailleurs donné un début de piste pour le pop-up,
  pour une frame, on pourrait aussi... )

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
<hr />
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
21 oct. 2007 à 15:22
ah ben non... désolé, j'ai mal lu/vu !

    window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px";
    tu veux donc redimentionner une frame progressivement ?
    fait un setTimeout vers une fonction qui va le faire
       supposons la 2ème :

    var taille_voulue=taille initiale;
    fonction   {
        taille_voulue+=incrément;
        window.parent.document.body.rows="30px, "+taille_voulue+",33px, 0%, 0px";
        si taille_voule < taille maxi setTimout("fonction();",délai) ;  }
 

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]<hr />
0

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

Posez votre question
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 08:37
merci bien , je vais voir ce que je peux faire de sa ....
++
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 08:55
j'suis plutot coté script php... du kou je my perds la dedans , j'ai essayé sa >

<SCRIPT LANGUAGE="JavaScript">
    var taille_voulue=100%;
    var taille_voulue2=0%;
    fonction moove {
        taille_voulue+=-50;
        taille_voulue2+=50;
        window.parent.document.body.rows="30px, "+taille_voulue+",33px, "+taille_voulue2+", 0px";
        setTimout("fonction moove();",2) ;  }

</SCRIPT>

mais avec aucun resultat...
c'est une jeu de 5 cadres enfait , il y a un de ces cadres que je voudrais rétricir , au un autre , l'agrandir d'autant que l e1er a été rétrécit...

je comprends pas pkois ce code ne séxécute point....
merci davance a voo!
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 08:58
recopier coller du code....

<SCRIPT LANGUAGE="JavaScript">
    var taille_voulue=100%;
    var taille_voulue2=0%;
    fonction moove {
        taille_voulue+=-50;
        taille_voulue2+=50;
        window.parent.document.body.rows="30px, "+taille_voulue+",33px, "+taille_voulue2+", 0px";
        setTimout("fonction moove();",2) ;  }

</SCRIPT>
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 09:00
ya un truk ii pase pas , c pas grave....

window.parent.document.body.rows="30px, "+taille_voulue+",33px,"+taille_voulue2+", 0px";

voila...?
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 11:06
deja ne ne parvient pas a placer de time out
ni sur un onclick , ni ds ma fonction....
rien ne se passe ou alors , le timeout n'est poas pris en compte

>>>
>>>

<SCRIPT LANGUAGE="JavaScript">
function Frame_resizor1()
    {
    window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px";
    setTimeout(Frame_resizor1(), 2000) } // ou avec des " " "

..... help meeeeeeeee!!!
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 11:08
et meme >
<A HREF='javascript:SetTimeout(window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px", 200);'

ne fonctionne pas....
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
22 oct. 2007 à 12:59
tel que tu fais les choses, ça ne peut pas fonctionner,
    tu ne respectes pas la syntaxe de base..
relis ton code, et :


o--------o----------------------------------------------------------o
|FireFox |regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
| | |
| | et mieux, télécharger FireBug |
|--------|----------------------------------------------------------|
|Internet|activer le deboggage : Outils/options Internet/Avancés |
|Explorer| dans la liste, sous "Navigation" : décocher |
| | ° Afficher une notification de chaque erreur de script |
| | ° Désactiver le débogage de Scripts (autres applications)|
| | ° Désactiver le débogage de Scripts (Internet Explorer) |
| | |
| | et mieux, télécharger le Debogger IE |
|--------|----------------------------------------------------------|
|K-Meleon|regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
|--------|----------------------------------------------------------|
|Opera |regarder la "console d'erreurs" |
| | utils / Asole d'erreurs |
|--------|----------------------------------------------------------|
|Safari |modif Fichier "Support:\Documents and Settings\utilisateur|
| |\Application Data\Apple Computer\Safari\Preferences.plist"|
| | y ajouter <key>IncludeDebugMenu</key> |
| | <true/> |
| | |
| |regarder Debug / Show JavaScript Console |
o--------o----------------------------------------------------------o






<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
<hr />
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 13:22
trouvé!!

<sscript>
function Frame_resizor1a()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 0px";
    }
    function Frame_resizor1b()
    {
    window.parent.document.body.rows="30px, 60% ,33px, 40%, 0px";
    }
    function Frame_resizor1c()
    {
    window.parent.document.body.rows="30px, 70% ,33px, 30%, 0px";
    }
    function Frame_resizor1d()
    {
    window.parent.document.body.rows="30px, 80% ,33px, 20%, 0px";
    }
    function Frame_resizor1e()
    {
    window.parent.document.body.rows="30px, 90% ,33px, 10%, 0px";
    }
    function Frame_resizor1f()
    {
    window.parent.document.body.rows="30px, 95% ,33px, 5%, 0px";
    }
    function Frame_resizor1z()
    {
    window.parent.document.body.rows="30px, 100% ,33px, 0%, 0px";
    }
   
   
   
   
   
   
function Frame_resizor2a()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 0px";
    }
    function Frame_resizor2b()
    {
    window.parent.document.body.rows="30px, 40% ,33px, 60%, 0px";
    }
        function Frame_resizor2c()
    {
    window.parent.document.body.rows="30px, 30% ,33px, 70%, 0px";
    }
        function Frame_resizor2d()
    {
    window.parent.document.body.rows="30px, 20% ,33px, 80%, 0px";
    }
        function Frame_resizor2e()
    {
    window.parent.document.body.rows="30px, 10% ,33px, 90%, 0px";
    }
            function Frame_resizor2f()
    {
    window.parent.document.body.rows="30px, 5% ,33px, 95%, 0px";
    }
    function Frame_resizor2z()
    {
    window.parent.document.body.rows="30px, 0% ,33px, 100%, 0px";
    }
   
   
   
   
   
   
   
    function Frame_resizor3aa()
    {
    window.parent.document.body.rows="30px, 85% ,33px, 15%, 22px"
    }   
    function Frame_resizor3a()
    {
    window.parent.document.body.rows="30px, 75% ,33px, 25%, 22px"
    }
        function Frame_resizor3b()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 35%, 22px"
    }
        function Frame_resizor3c()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 45%, 22px"
    }
        function Frame_resizor3d()
    {
    window.parent.document.body.rows="30px, 45% ,33px, 55%, 22px"
    }
        function Frame_resizor3e()
    {
    window.parent.document.body.rows="30px, 35% ,33px, 65%, 22px"
    }
        function Frame_resizor3f()
    {
    window.parent.document.body.rows="30px, 25% ,33px, 75%, 22px"
    }
    function Frame_resizor3g()
    {
    window.parent.document.body.rows="30px, 15% ,33px, 85%, 22px"
    }
    function Frame_resizor3h()
    {
    window.parent.document.body.rows="30px, 35% ,33px, 75%, 22px"
    }
        function Frame_resizor3i()
    {
    window.parent.document.body.rows="30px, 45% ,33px, 65%, 22px"
    }
        function Frame_resizor3j()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 55%, 22px"
    }
            function Frame_resizor3k()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 45%, 22px"
    }
                function Frame_resizor3l()
    {
    window.parent.document.body.rows="30px, 75% ,33px, 35%, 22px"
    }
                function Frame_resizor3m()
    {
    window.parent.document.body.rows="30px, 65% ,33px, 45%, 22px"
    }
            function Frame_resizor3n()
    {
    window.parent.document.body.rows="30px, 55% ,33px, 55%, 22px"
    }
        function Frame_resizor3z()
    {
    window.parent.document.body.rows="30px, 50% ,33px, 50%, 22px"
    }
 function Test1(){
  setTimeout("Frame_resizor1a()", 0);
    setTimeout("Frame_resizor1b()", 40);
      setTimeout("Frame_resizor1c()", 70);
        setTimeout("Frame_resizor1d()", 100);
         setTimeout("Frame_resizor1e()", 130);
          setTimeout("Frame_resizor1f()", 160);
 setTimeout("Frame_resizor1z()", 190);
 }
  function Test2(){
  setTimeout("Frame_resizor2a()", 0);
    setTimeout("Frame_resizor2b()", 40);
      setTimeout("Frame_resizor2c()", 70);
        setTimeout("Frame_resizor2d()", 100);
         setTimeout("Frame_resizor2e()", 130);
          setTimeout("Frame_resizor2f()", 160);
 setTimeout("Frame_resizor2z()", 190);
 }
   function Test3(){
  setTimeout("Frame_resizor3a()", 0);
    setTimeout("Frame_resizor3aa()", 50);
    setTimeout("Frame_resizor3b()", 100);
      setTimeout("Frame_resizor3c()", 150);
        setTimeout("Frame_resizor3d()", 200);
         setTimeout("Frame_resizor3e()", 250);
           setTimeout("Frame_resizor3f()", 300);
            setTimeout("Frame_resizor3g()", 350);
             setTimeout("Frame_resizor3h()", 400);
             setTimeout("Frame_resizor3i()", 450);
             setTimeout("Frame_resizor3j()", 500);
             setTimeout("Frame_resizor3k()", 550);
             setTimeout("Frame_resizor3l()", 600);
             setTimeout("Frame_resizor3m()", 650);
             setTimeout("Frame_resizor3n()", 700);
 setTimeout("Frame_resizor3z()",750);
 }
</SCRIPT>

résultat ici > www.google-enhanced.com
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
22 oct. 2007 à 14:10
oulah... tu fais peur.
le moins qu'on puisse dire, c'est qu'on peut simplifier
mais bon... si ça te convient.....
<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
<hr />
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 16:42
je suis prenneur pour tout solution plus courte..... c'est vrai que c'est laborieux des que l'on veut changer une valeuire , fo tout changer.......
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
22 oct. 2007 à 17:06
>>setTimeout("Frame_resizor3a()", 0);
    setTimeout("Frame_resizor3aa()", 50);
    setTimeout("Frame_resizor3b()", 100);
      setTimeout("Frame_resizor3c()", 150);
        setTimeout("Frame_resizor3d()", 200);
         setTimeout("Frame_resizor3e()", 250);
           setTimeout("Frame_resizor3f()", 300);
            setTimeout("Frame_resizor3g()", 350);
             setTimeout("Frame_resizor3h()", 400);
             setTimeout("Frame_resizor3i()", 450);
             setTimeout("Frame_resizor3j()", 500);
             setTimeout("Frame_resizor3k()", 550);
             setTimeout("Frame_resizor3l()", 600);
             setTimeout("Frame_resizor3m()", 650);
             setTimeout("Frame_resizor3n()", 700
???
    une seule fonction qui incrémente une variable , non ?
       et qui ne se relance pas quand le maxi est atteint
       ( comme mon 1er exemple )



    pareil pour le  reste.




<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
<hr />
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
22 oct. 2007 à 19:53
moi jsai op faire , g trop du mal a construire du javascript....
pourtant sa roule ac le php , mai , jsai pas , .......
si tu peux me completer ton, 1er exemple , jme débrouillerais pour faire les autres bouton ..... dsl
jsui kun assisté... prtant c'est pas faute d'essayer
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
23 oct. 2007 à 09:41
   
je suis incapable de te lire.

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
<hr />
0
cs_pipouz Messages postés 56 Date d'inscription dimanche 27 novembre 2005 Statut Membre Dernière intervention 27 septembre 2008
30 mai 2008 à 10:51
oui , désolé

je fais un effort ^^

hummm et bien je remercies , mais je suis plutot hérmétique au javascript.... memem si jessayes depuis pas mal de temps.

et donc je en sais comment completer mon code avec ton scripts.

mais ce nest pas grave , la fonction marche tres bien :)

merci a toi et bonne journée
0
Rejoignez-nous