IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

DIV absolute qui dépend du scroll


Sujet :

Défilement en CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Août 2010
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2010
    Messages : 18
    Par défaut DIV absolute qui dépend du scroll
    Bonjour à tous,

    Tout d'abord, désolé pour cet intitulé un peu particulier ! Voici mon problème : je créé mon propre site qui comportera des articles écrits de ma plume.
    Chaque article comporte des commentaires, qui s'affichent lorsque l'on clique sur un lien. Le clic sur le lien affiche un calque jusqu'ici caché qui contient les commentaires.

    Voilà, j'aimerais maintenant que ce calque en question (qui est superposé par un z-index supérieur aux autres) s'affiche au centre de la fenêtre (ce qui est faisable avec un position:fixed) mais que l'on puisse défiler pour afficher tous les commentaires (ce qui est faisable avec une position:absolute).

    Autrement dit, si je met position:fixed mon cadre s'affiche bien au centre de la fenêtre (c'est à dire aussi bien quand je suis sur un article "bas" dans la page) mais je ne peux plus descendre dans les commentaires (normal, le calque est "fixed").
    Si je met position:absolute je peux défiler, mais mon calque est tout en haut de la page, donc si je suis sur un article "bas" il faut que je remonte toute la page pour voir les commentaires.

    Vous voyez mon souci? Je ne trouve pas de solution pourtant je sais que ça existe !

    Merci infiniment de votre aide :-)

  2. #2
    Membre averti
    Profil pro
    Inscrit en
    Août 2010
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2010
    Messages : 18
    Par défaut
    J'ai une réponse possible à ma propre question : je récupère la position du scroll vertical en javascript et je modifie le margin-top du calque pour qu'il vaille cette valeur :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    var positionScroll = document.body.scrollTop;
    surcalque.style.marginTop = positionScroll+20;

  3. #3
    Rédacteur

    Homme Profil pro
    Responsable de projet
    Inscrit en
    Mai 2009
    Messages
    634
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France

    Informations professionnelles :
    Activité : Responsable de projet
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2009
    Messages : 634
    Par défaut
    Salut,

    tu peux fixer une hauteur à ton bloc qui contient les commentaires et y ajouter un Cela ajoutera une scroll bar à ton bloc de commentaire

Discussions similaires

  1. Div qui suit le Scroll
    Par izbing dans le forum jQuery
    Réponses: 1
    Dernier message: 19/02/2012, 10h18
  2. DIV qui suit le scroll de l'écran sans se superposer sur les autres !
    Par Dsphinx dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 12/07/2011, 11h43
  3. DIV absolute qui s'adapte en hauteur à son contenu
    Par Khleo dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 07/06/2011, 20h24
  4. div qui suit le scroll sans depasser hauteur div
    Par ju0123456789 dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 23/02/2011, 09h15
  5. Div qui suit le scroll
    Par topolino dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 02/09/2009, 15h49

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo