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

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Ascenseur sans passer par des frames?

 


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

Ascenseur sans passer par des frames?

n°516394
saxgard
Posté le 17-09-2003 à 11:13:42  profilanswer
 

exist-il une solution pour avoir un ascenseur dans une zone d'un tableau ,( je préfère les tableaux aux frames)
 
merci.

mood
Publicité
Posté le 17-09-2003 à 11:13:42  profilanswer
 

n°516398
antp
Super Administrateur
Champion des excuses bidons
Posté le 17-09-2003 à 11:15:41  profilanswer
 

<div style="overflow: auto;">


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
n°516399
saxgard
Posté le 17-09-2003 à 11:20:17  profilanswer
 

antp a écrit :

<div style="overflow: auto;">


 
ok merci je vais voir ca de plus près

n°516402
saxgard
Posté le 17-09-2003 à 11:23:44  profilanswer
 

ca marcqhe que pour internet explorer?

n°516405
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 11:27:02  profilanswer
 

Saxgard a écrit :

ca marcqhe que pour internet explorer?  


 
Non, ça marche également pour Mozilla, mais la hauteur du div doit à ce moment-là être précisée et pas en %... (hélas).

n°516410
saxgard
Posté le 17-09-2003 à 11:34:10  profilanswer
 

hmm je n'ai pas d'ascenseur :/
bon je fais des rechreches pour voir d'ou ca vient ;o)

n°516412
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 11:39:28  profilanswer
 

Saxgard a écrit :

hmm je n'ai pas d'ascenseur :/
bon je fais des rechreches pour voir d'ou ca vient ;o)


 
Div en absolute aussi...  :)

n°516417
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 11:49:40  profilanswer
 

Un peu d'auto-promo : http://www.alsacreations.com/articles/frames/ ;)


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516418
saxgard
Posté le 17-09-2003 à 11:50:00  profilanswer
 

Hermes le Messager a écrit :


 
Div en absolute aussi...  :)  


hmm c'esta dire?

n°516430
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 12:14:48  profilanswer
 


 
Et toi regarde ça !!!!!!! Je crois que cette fois j'ai trouvé ce que je cherchais depuis si longtemps :
 
Passe avec Ie 5.5+, Moz 1+ et opera 7+
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  6. <title>test</title>
  7.  <style type="text/css" media="screen"><!--
  8. html,body { margin: 0px; padding: 0px; width: 100%; height: 100%; overflow: hidden }
  9. .tbl-test  { position: absolute; width: 100%; height: 100% }
  10. .cell1 { background-color: #6fc; height: 50px }
  11. .cell2   { background-color: #900; vertical-align: top; height: 100% }
  12. .cell3 { background-color: #6ff; height: 50px }
  13. .inter    { position: relative; height: 100% }
  14. .tst-div          { color: white; position: absolute; width: 100%; height: 100%; overflow: auto }
  15. --></style>
  16. </head>
  17. <body>
  18. <table class="tbl-test" cellspacing="0" cellpadding="0">
  19. <tr>
  20.  <td class="cell1">
  21.  </td>
  22. </tr>
  23. <tr>
  24.  <td class="cell2">
  25.  <div class="inter">
  26.  <div class="tst-div">
  27.  machin...<br />
  28.  machin...<br />
  29.  machin...<br />
  30.  machin...<br />
  31.  machin...<br />
  32.  machin...<br />
  33.  machin...<br />
  34.  machin...<br />
  35.  machin...<br />
  36.  machin...<br />
  37.  machin...<br />
  38.  machin...<br />
  39.  machin...<br />
  40.  machin...<br />
  41.  machin...<br />
  42.  machin...<br />
  43.  machin...<br />
  44.  machin...<br />
  45.  machin...<br />
  46.  machin...<br />
  47.  machin...<br />
  48.  machin...<br />
  49.  machin...<br />
  50.  machin...<br />
  51.  machin...<br />
  52.  machin...<br />
  53.  machin...<br />
  54.  machin...<br />
  55.  machin...<br />
  56.  machin...<br />
  57.  machin...<br />
  58.  machin...<br />
  59.  machin...<br />
  60.  machin...<br />
  61.  machin...<br />
  62.  machin...<br />
  63.  machin...<br />
  64.  machin...<br />
  65.  machin...<br />
  66.  machin...<br />
  67.  machin...<br />
  68.  machin...<br />
  69.  machin...<br />
  70.  machin...<br />
  71.  machin...<br />
  72.  machin...<br />
  73.  machin...<br />
  74.  machin...<br />
  75.  machin...<br />
  76.  machin...<br />
  77.  machin...<br />
  78.  machin...<br />
  79.  machin...<br />
  80.  machin...<br />
  81.  machin...<br />
  82.  machin...<br />
  83.  machin...<br />
  84.  machin...<br />
  85.  machin...<br />
  86.  machin...<br />
  87.  machin...<br />
  88.  machin...<br />
  89.  machin...<br />
  90.  machin...<br />
  91.  machin...<br />
  92.  machin...
  93.  </div>
  94.  </div>
  95.  </td>
  96. </tr>
  97. <tr>
  98.  <td class="cell3">
  99.  </td>
  100. </tr>
  101. </table>
  102. </body>
  103. </html>


 
Confirmez moi si vous avez un problème et tester avec firebird si vous l'avez !  :bounce:  :bounce:

mood
Publicité
Posté le 17-09-2003 à 12:14:48  profilanswer
 

n°516431
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 12:20:37  profilanswer
 

Sur Firebird, ça fait une zone scrollable au milieu de la page. C'est ce que tu voulais ?


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516432
saxgard
Posté le 17-09-2003 à 12:23:11  profilanswer
 

overflow ca marche pas  
 
exmeple:
<table align="center" width="640" height="480" valign="top" border="1">
  <tr valign="top" height="100">
  <td>
  <div style="overflow: auto;">
  <img src="images/test.gif" alt="logo" border="0"
       align=left valign=bottom >
  <h1>&nbsp;</h1>dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
  </div>
  </td>
  </tr>
 
une idée? je fais surement uen belle boulette mais je voix pas


Message édité par saxgard le 17-09-2003 à 12:23:55
n°516435
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 12:31:36  profilanswer
 

SIBELIUS a écrit :

Sur Firebird, ça fait une zone scrollable au milieu de la page. C'est ce que tu voulais ?


 
Oui, tout à fait, mais ce qui m'intéresse, c'est que cette zone se redimensionne en fonction de la taille de la fenêtre. Peut-tu me faire une capture que je vois ce qu'il en est ?  :)

n°516437
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 12:34:26  profilanswer
 

Saxgard a écrit :

overflow ca marche pas  
 
exmeple:
<table align="center" width="640" height="480" valign="top" border="1">
  <tr valign="top" height="100">
  <td>
  <div style="overflow: auto;">
  <img src="images/test.gif" alt="logo" border="0"
       align=left valign=bottom >
  <h1>&nbsp;</h1>dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
  </div>
  </td>
  </tr>
 
une idée? je fais surement uen belle boulette mais je voix pas


 
1) Apprend déjà à appliquer une classe à un div. (donc les class dans le head et ensuite : <div class="nom-de-la-classe">
 
2) Je t'ai dit que le div doit être en absolute. Il faut donc créer une class pour ton div et préciser une hauteur ainsi que le fait qu'il est en absolute. Difficile d'être plus clair.
 
Si tu ne comprends pas ces explications, il va falloir que tu apprennes certaines choses avant de pouvoir réaliser ce que tu veux faire. Donc, fais dans un premier temps quelques tutos sur les CSS et en particulier les positionnements de divs et les définitions de classes, et ensuite tu pourras faire ce que tu veux faire actuellement.  :)

n°516440
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 12:43:19  profilanswer
 

Hermes le Messager a écrit :


 
Oui, tout à fait, mais ce qui m'intéresse, c'est que cette zone se redimensionne en fonction de la taille de la fenêtre. Peut-tu me faire une capture que je vois ce qu'il en est ?  :)  


Voilà pour toi ;) http://www.alsacreations.com/divers/cap3.gif


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516443
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 12:48:03  profilanswer
 


 
C'est bien ce que je voulais !!!  :bounce:  :bounce:  
 
Si tu arrives à correctement resizer la fenêtre, cela signifie qu'on a enfin une solution crossbrowser pour faire ce qu'on pouvait faire uniquement avec des frames. (A savoir un design entièrement en % avec un haut et un bas fixe et un contenu scrollable !)  [:yaisse2]

n°516451
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 12:53:29  profilanswer
 

Tu as l'air content d'être heureux ;)
 
Sur quels navigateurs ça ne fonctionne pas, ça :
http://www.alsacreations.com/artic [...] frames.php ?


Message édité par sibelius le 17-09-2003 à 12:54:52

---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516455
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 13:05:52  profilanswer
 

SIBELIUS a écrit :

Tu as l'air content d'être heureux ;)
 
Sur quels navigateurs ça ne fonctionne pas, ça :
http://www.alsacreations.com/artic [...] frames.php ?


 
ça fonctionne partout, mais le gros problème, c'est que la hauteur est DEFINIE. Hors, moi ce que je cherchais, c'est le moyen de réaliser l'histoire avec des bords en haut et en bas fixe, mais une hauteur centrale adaptable automatiquement sans passer par du JS.
 
 :hello:

n°516459
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 13:11:19  profilanswer
 

ah oui, bien joué ;)


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516473
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 13:31:17  profilanswer
 

SIBELIUS a écrit :

ah oui, bien joué ;)


 
 [:totozzz] Je trouve aussi... ça faisait juste plusieurs mois que je cherchais à le faire. Ya même eu un topic consacré à ce problème...  :)

n°516474
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 13:31:26  profilanswer
 

Avec les % ça a l'air de bien marcher aussi :  
http://www.alsacreations.com/artic [...] estest.php


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516475
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 13:32:56  profilanswer
 

SIBELIUS a écrit :

Avec les % ça a l'air de bien marcher aussi :  
http://www.alsacreations.com/artic [...] estest.php


Non, petit scarabé. ça ne marche pas.
 
Tes bords en haut et en bas sont en %, les miens ont une taille fixe.  [:totozzz]  [:yaisse2]  [:yaisse2]

n°516484
saxgard
Posté le 17-09-2003 à 13:39:39  profilanswer
 

Hermes le Messager a écrit :


 
1) Apprend déjà à appliquer une classe à un div. (donc les class dans le head et ensuite : <div class="nom-de-la-classe">
 
2) Je t'ai dit que le div doit être en absolute. Il faut donc créer une class pour ton div et préciser une hauteur ainsi que le fait qu'il est en absolute. Difficile d'être plus clair.
 
Si tu ne comprends pas ces explications, il va falloir que tu apprennes certaines choses avant de pouvoir réaliser ce que tu veux faire. Donc, fais dans un premier temps quelques tutos sur les CSS et en particulier les positionnements de divs et les définitions de classes, et ensuite tu pourras faire ce que tu veux faire actuellement.  :)  


 
ok je te remercie  ,la tt me parait plus clair  ;o)

n°516529
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 14:26:26  profilanswer
 

Alors Sibelius, on calle ?  :whistle:  [:totozzz]


Message édité par Hermes le Messager le 17-09-2003 à 14:26:49
n°516564
Hermes le ​Messager
...pipi dans la mer...
Posté le 17-09-2003 à 15:09:55  profilanswer
 

Tiens un petit détail : Il faut corriger un bug d'IE qui 1/2 montre le scroll horizontal quand on redimensionne en ajoutant overflow-x : hidden;
 
 :sol:

n°516582
antp
Super Administrateur
Champion des excuses bidons
Posté le 17-09-2003 à 15:35:02  profilanswer
 

Hermes le Messager a écrit :


 
1) Apprend déjà à appliquer une classe à un div. (donc les class dans le head et ensuite : <div class="nom-de-la-classe">
 


 
ouais enfin le coup du style= c'est moi qui l'ai montré :D


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
n°516632
sibelius
Vous êtes sûr ?
Posté le 17-09-2003 à 16:36:13  profilanswer
 

Hermes le Messager a écrit :

Alors Sibelius, on calle ?  :whistle:  [:totozzz]


Hey Grand-Maître, laisse-moi le temps de rentrer de l'entraînement ;)
... bon en effet, je m'incline une fois de plus...  :jap:


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°516634
saxgard
Posté le 17-09-2003 à 16:36:31  profilanswer
 

antp a écrit :


 
ouais enfin le coup du style= c'est moi qui l'ai montré :D


 
merci antp ;o)
c parceque je te faisai confiance vuq ue t le moderateur  alors j'ai pas douté de ta ligne  :D

n°516733
antp
Super Administrateur
Champion des excuses bidons
Posté le 17-09-2003 à 19:33:10  profilanswer
 

bah Hermes est encore plus extrémiste que moi pour le HTML :D


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
n°517028
anapajari
s/travail/glanding on hfr/gs;
Posté le 18-09-2003 à 12:51:15  profilanswer
 

j'ai surement pas tout compris hermes mais n'obtient-on pas le meme resultat en faisant comme ça:

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  6.  
  7. <title>test</title>
  8. <style type="text/css" media="screen"><!--
  9. html,body { margin: 0px; padding: 0px; width: 100%; height: 100%; overflow: hidden }
  10. .header{ position: absolute; top:0px; height: 100px; }
  11. .content{position: absolute; top:100px; bottom: 100px; overflow:auto }
  12. .footer{position: absolute; height: 100px; bottom: 0px}
  13. --></style>
  14. </head>
  15. <body>
  16. <div class="header">HEAD</div>
  17. <div class="content">CONTENT</div>
  18. <div class="footer">FOOTER</div>
  19. </body>
  20. </html>

n°517060
Hermes le ​Messager
...pipi dans la mer...
Posté le 18-09-2003 à 13:16:45  profilanswer
 

Non, si je rempli le content, il passe par dessus le footer...  [:totozzz]

n°517202
fastclemmy
Dictateur en plastique
Posté le 18-09-2003 à 15:08:46  profilanswer
 

Pour l'instant j'ai une version qui passe sous Moz et Opera...


---------------
Sponsorisez la conférence Paris Web 2017 - Regardez des Lego sur Pinterest
n°517207
Hermes le ​Messager
...pipi dans la mer...
Posté le 18-09-2003 à 15:12:46  profilanswer
 

fastclemmy a écrit :

Pour l'instant j'ai une version qui passe sous Moz et Opera...


 
C'est bien déjà. Montre là, qu'on voit ça.  :)

n°517210
fastclemmy
Dictateur en plastique
Posté le 18-09-2003 à 15:16:22  profilanswer
 
n°517214
Hermes le ​Messager
...pipi dans la mer...
Posté le 18-09-2003 à 15:19:15  profilanswer
 


 
 
Félicitation, c'est déjà très bien.  :jap:  :jap:

n°517241
fastclemmy
Dictateur en plastique
Posté le 18-09-2003 à 15:47:00  profilanswer
 

Solution pourrÿte (surtout au resize :D) IE only  [:fastclemmy]  
 
http://fastclemmy.com/tests/defi1_bis.htm


Message édité par fastclemmy le 18-09-2003 à 15:55:00

---------------
Sponsorisez la conférence Paris Web 2017 - Regardez des Lego sur Pinterest
n°517250
Hermes le ​Messager
...pipi dans la mer...
Posté le 18-09-2003 à 15:53:20  profilanswer
 

Gizmo a déjà proposé ta soluce dans l'autre topic, et moi-même j'ai trouvé la soluce pour IE dans ce même topic.
 
Mais bravo quand même, parce que même pour arriver à ce résultat, c'est pas si simple.  ;)

n°517256
fadenretur​ns
Posté le 18-09-2003 à 15:58:06  profilanswer
 

Joli fast clemmy.
 
Mais sur IE5 ça marche pas bien.


---------------
mon blog : http://www.magnin-sante.ch/journal/
n°517291
fastclemmy
Dictateur en plastique
Posté le 18-09-2003 à 16:24:32  profilanswer
 

Bon bah je jette l'éponge avec cette dernière tentative crossbrowser (testé OK sur IE6, FB0.6.1, Opera 7) mais avec un soupçon de JS dans la CSS pour IE + un petit hack. [:spamafote]
http://fastclemmy.com/tests/defi1_final.htm


---------------
Sponsorisez la conférence Paris Web 2017 - Regardez des Lego sur Pinterest
n°517436
fadenretur​ns
Posté le 18-09-2003 à 18:35:10  profilanswer
 

Moi j'ai fait ça au final, pas de js, pas hack, juste des selecteurs.
 
ça passe avec IE5, IE6 ( je crois ) et Mozilla
 
Opera ça je pense pas :) mais faut essayer...


---------------
mon blog : http://www.magnin-sante.ch/journal/
mood
Publicité
Posté le   profilanswer
 

 Page :   1  2
Page Précédente

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

  Ascenseur sans passer par des frames?

 

Sujets relatifs
frames, petit problemeAstuces ? passer outre la confirmation de renvoi d'informations
Vous êtes plus pseudos frames ou includes ?[XHTML CSS] Passer site de table en div
Passer une page d'authentification web et garder la connexionpseudos frames
Faire passer un chemin à un script JS ?Effacer une variable avec une pseudos-frames ?
Faire passer une variable de VBA à une page Word ?Passer une variable java script a une page php.
Plus de sujets relatifs à : Ascenseur sans passer par des frames?



Copyright © 1997-2016 Hardware.fr SARL (Signaler un contenu illicite) / Groupe LDLC / Shop HFR