Css position:fixed; sans scroll horizontal [Résolu]

ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 12:48 - Dernière réponse : ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention
- 9 juin 2009 à 12:06
Bonjour à tous,

j'ai un souci en css, je ne sais pas si cela est possible alors je demande a tout hasard ...
voila j'ai une div en position:fixed; je voudrais qu'elle reste visible et donc fixe, losque je scroll ma page verticalement mais pouvoir voir le contenu de cette meme div lors d'un scroll horizontal car celle-ci n'est pas visible entierement horizontalement.

|------------------------------------------------|
|  |----------------------------------------------|----------------|
|  |                   ma div (fixed)                             |                         |
|  |__________________________________ |____________|
|                                                                        |             /\
|                                                                        |              |______ (partie de ma div non visible (cause:position:fixed;)
|                          ma page                                 |              
|                                                                        |
|                                                                        |
|                                                                        |
|                                                                        |
|____________________________________|

voila j'espere avoir été assez clair dans mes explications.

Merci de votre aide.
Afficher la suite 

Votre réponse

12 réponses

Meilleure réponse
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 9 juin 2009 à 12:06
1
Merci
Bonjour,
j'ai trouvé la réponse à mon probleme :

mettre la div en position:absolue;
ajouter ce javascript qui "deplace" ma div seulement de maniere vertical :

<script type="text/javascript">

function move_calendrier()

{

var Y = document.body.scrollTop;

document.getElementById("div_calendrier").style.top=Y;

}

</script>

(pour un deplacement horizontal :
          var X = document.body.scrollLeft;
          document.getElementById("div_calendrier").style.left=X;)

et le body :

Voila si ca peut aider quelqu'un ...

Merci ghost_of_prog 1

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 93 internautes ce mois-ci

Commenter la réponse de ghost_of_prog
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 12:52
0
Merci
je refais mon schema (désolé) :

|-------------------------------------|
|  |-----------------------------------|----------------|
|  |                   ma div (fixed)             |                        |
|  |__________________________ |____________|
|                                                        |             /\
|                                                       
|              |______ partie de ma div non visble
|                          ma page                 |                             
(cause:position:fixed;)
|                                                        |
|                                                        |
|                                                        |
|____________________________|


Merci de votre aide.
Commenter la réponse de ghost_of_prog
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 8 juin 2009 à 13:00
0
Merci
Bonjour,

position:fixed, c'est génial, et ça permet de "déplacer"
    un élément, de le laisser au même endroit relatif,
    y compris en cas de scroll ( horizontal et/ou vertical )
mais bon... c'est la position du coin en haut à gauche de cet élément
    qui "bouge"
    et rien d'autre ( pas la taille ou quoi que cela soit ! )
t'es sûr que sans scroller, ton élément est TOTALEMENT visible ?
si non, au scroll... ce sera pareil
ou alors.. j'ai rien compris ?

Cordialement
Commenter la réponse de Bul3
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 14:39
0
Merci
merci de me repondre bul3,

en faite ma div est trop large en haut pour tout afficher du coup j'aurais besoin de pouvoir scroller horizontalement sans que la div ne bouge pour pouvoir voir le reste de ma div, mais qu'elle se "deplace" verticalement quand je scrolle verticalement seulement.

je sais pas si je suis clair ... sinon je peux te passer le code ce sera peut etre plus simple ...
Commenter la réponse de ghost_of_prog
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 14:51
0
Merci
voila le code en simplifié :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Page title</title>

<style type="text/css">
.le_calendrier{
    border-width: 1px;
       border-style: solid;
       border-color: #000000;
    background-color: #AEFAEF;

    width:3500px;
    height:20px;
    position:fixed;
    z-index:5;
}

</style>
</head>

Janvier,Fevrier,Mars,Avril,Mai,Juin,Juillet,Aout,Septembre,Octobre,Novembre,Decembre=> 2001 puis Janvier,Fevrier,Mars,Avril,Mai,Juin,Juillet,Aout,Septembre,Octobre,Novembre,Decembre =>2002 puis Janvier,Fevrier,Mars,Avril,Mai,Juin,Juillet,Aout,Septembre,Octobre,Novembre,Decembre 2003

1
2
3
4
5
6
7
8
9
10
1
2
3
4
5
6
7
8
9
10
Commenter la réponse de ghost_of_prog
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 8 juin 2009 à 15:03
0
Merci
>>je sais pas si je suis clair ...
je ne sais pas... mais j'ai pas compris moi !
et.. tu as lu ce que je disais ? je ne crois pas !!!!

>>ma div est trop large en haut pour tout afficher du coup
>>j'aurais besoin de pouvoir scroller horizontalement sans que
>>la div ne bouge pour pouvoir voir le reste de ma div,
justement !
et : meuh.....
2 chose position:fixed, je t'ai expliqué,
après tu veux adapter quoi à la taille de quoi ? ( et position:fixed,
c'est la position !!! pas la taille !!!! )
sans oublier que le redimensionnement des fenêtres
ce n'est autorisé que si on le permet !!
Commenter la réponse de Bul3
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 15:33
0
Merci
oui oui j'ai bien lu ton premier message,

j'ai envoyé le code (voir plus haut) pour que tu vois mon souci ....
pour repondre a tes questions :

=> "t'es sûr que sans scroller, ton élément est TOTALEMENT visible ?"
- Non justement dès le debut je ne vois pas toute ma div d'où l'intérêt de pouvoir scroller horizontalement et effectivement comme tu le dis au scroll c'est pareil le div se "deplace avec le scroll donc impossible de voir le reste de ma div  .

=>"ça permet de "déplacer"    un élément, de le laisser au même endroit relatif,     y compris en cas de scroll ( horizontal et/ou vertical )"
- Si cela signifie que position:fixed; ne peut rester "sans bouger" pour aucun  scroll (horizontal ou vertical ) et donc que l'utilisation de position:fixed; n'est pas la bonne solution, aurais tu un conseil à me donner ?

Merci de tes reponses.
Commenter la réponse de ghost_of_prog
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 8 juin 2009 à 15:45
0
Merci
>>donc que l'utilisation de position:fixed; n'est pas la bonne solution,
je répète ? position:fixed s'occupe de la position d'un élément dans la page
pas du tout de sa taille, ni de la taille de la fenêtre !!!!
>>aurais tu un conseil à me donner ?
adapter la taille au contenu ! mais comme déjà dit :
sans oublier que le redimensionnement des fenêtres
ce n'est autorisé que si on le permet !!
Commenter la réponse de Bul3
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 16:00
0
Merci
Je n'ai jamais souhaité changer la taille de ma div ni celle de ma fenetre, juste permet un scroll horizontal tout en gardant les caracteristiques de position:fixed; pour le scroll vertical (a savoir un simple deplacement verticale uniquement), étant donné que ceci n'est pas possible, je vais essayer de trouver une autre solution car comme le montre mon code je ne peux pas changer l'organisation de ma div ni meme sa taille par la meme occasion.

Merci comme meme de tes réponses.
Commenter la réponse de ghost_of_prog
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 8 juin 2009 à 16:18
0
Merci
>>un scroll horizontal tout en gardant les caracteristiques de
position:fixed;
???? navré..... je ne comprend plus rien ????
position:fixed c'est horizontal ET vertical
>>pour le scroll vertical...étant donné que ceci n'est pas possible
c'est bien ce que je dis... je ne comprend plus rien

je répète néanmoins : position:fixed ne s'occupe que de la position
de l'élément. pas de sa taille.
si cette taille dépasse celle de la fenêtre ( ou du conteneur )
soit laisser l'utilisateur scroller,
soit mettre la taille en %,
soit adapter la taille du conteneur à son contenu
soit...
ne comprenant pas ce qu'il faut.... surtout compte tenu de :
>>je ne peux pas changer l'organisation de ma div ni meme sa taille par la meme occasion
je ne peux guère aider plus !!!!! ( si on ne peut rien adapter, il ne reste
qu'à laisser l'internaute scroller si nécessaire !)
Commenter la réponse de Bul3
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 16:42
0
Merci
Effectivement j'ai l'impression que l'on ne se comprends pas.
As tu regardé et affiché le code que j'ai posté ?

>> position:fixed c'est horizontal ET vertical
- Je vais donc abandonné position:fixed;

>>soit laisser l'utilisateur scroller, soit mettre la taille en %,soit adapter la taille du conteneur à son contenu
- Ce que je souhaite faire c'est effective de laisser l'utilisateur scroller, cependant ma div contient des mois avec leurs jours sur plusieurs années (voir code)  afin de pouvoir effectuer un media planning  ainsi le contenu de ma div ne peut pas etre reduit  ou organiser d'une autre manière:
 
             juin   2009               juillet 2009                   Aout 2009         etc ...      } ma div
       |1 2 3 4 5 6 ... 30 | 1 2 3 ... 28 29 30 31 |  1 2 3 4 5 ... 30 31 | etc ...         } ma div
  A  |      X X X X
  B  |                                        X X X X
  C  |                                                                                        XXXXXXXXX
  D  |                     XXXXX
etc...
Ainsi un scroll horizontal est utile pour pouvoir consulter les autres mois et années de ma div mais dans le cas ou je souhaiterais consulter vers le bas de ma page il faudrait que cette div de mois "se deplace" avec mon scroll vertical, pour y associer mes dates avec mes taches (Y et Z par exemple) d'où mon :
>>"je ne peux pas changer l'organisation de ma div ni meme sa taille"
Commenter la réponse de ghost_of_prog
ghost_of_prog 31 Messages postés jeudi 18 mai 2006Date d'inscription 9 juin 2009 Dernière intervention - 8 juin 2009 à 16:43
0
Merci
le schema :
 
             juin   2009               juillet 2009         | etc ...      } ma div
       |1 2 3 4 5 6 ... 30 | 1 2 3 ... 28 29 30 31 | etc ...         } ma div
  A  |      X X X X
  B  |                                        X X X X
  C  |         XXXXXXXXX
  D  |                     XXXXX
etc...
Commenter la réponse de ghost_of_prog

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.