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 :

Position fixe en CSS [Tutoriel]


Sujet :

Positionnement en CSS

  1. #1
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut Position fixe en CSS
    Bonjour,

    Le tutoriel que je vous présente va vous expliquer comment positionner en CSS un élément de manière fixe, aussi bien sur Firefox ou les autres navigateurs alternatifs que sur Internet Explorer 6 et 7.

    N'hésitez pas à me faire part de vos remarques, suggestions, questions... dans cette discussion.

    Bonne lecture à tous.

  2. #2
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Avril 2009
    Messages
    13
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2009
    Messages : 13
    Points : 32
    Points
    32
    Par défaut
    Salut,

    Merci pour ce tuto. J'ai bien aimé.

    En fait, je me demande quel framework javascript t'as utilisé. Aussi, serait-ce possible de me filer le code source dece tuto ? je te serais très reconnaissant.

    Merci bien

  3. #3
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut
    Heu, je n'ai utilisé aucun framework Javascript. La position fixe se fait en CSS et non en Javascript (excepté le patch IE6).

    Et le code source .... Ben il est dans le tuto.

  4. #4
    Nouveau Candidat au Club
    Homme Profil pro
    Chef de projet MOA
    Inscrit en
    Octobre 2011
    Messages
    1
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Indre et Loire (Centre)

    Informations professionnelles :
    Activité : Chef de projet MOA
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : Octobre 2011
    Messages : 1
    Points : 1
    Points
    1
    Par défaut pile poil
    Voici précisément ce que je recherchais.

    Merci pour ce tuto, aussi rapide, efficace que clair.

  5. #5
    Nouveau Candidat au Club
    Femme Profil pro
    artiste
    Inscrit en
    Novembre 2011
    Messages
    1
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : Belgique

    Informations professionnelles :
    Activité : artiste
    Secteur : Arts - Culture

    Informations forums :
    Inscription : Novembre 2011
    Messages : 1
    Points : 1
    Points
    1
    Par défaut en rapport avec l'image fixe
    Bonjour à tous et toutes,

    Je ne suis en aucun cas une pro du web, mais j'ai réussi à améliorer notre site, faute de personnel adéquat et dans l'urgence, en me débrouillant comme je peux, cependant, je rencontre deux soucis sous IE 8, que je n'ai pas sous FF
    Mon image menu ( manche de guitare) est bien fixe, et reste fixe sur toutes les pages, mais il m'affiche juste à côté un cadre avec une croix rouge, en bas de chaque page :en clair, j'ai bien vu que c'est l'image du manche de guitare en mode "not available"...comme son reflet..rien de tout cà sous firefox.
    http://www.wild-widow.com/menu.php
    - l'autre souci est le lecteur audio il ne s'affiche pas.
    http://www.wild-widow.com/menu.php?show=media

    Et sur une de mes pages une fois cliqué sur un des onglets du menu, le menu ne fonctionne plus...
    http://www.wild-widow.com/menu.php?show=listen

    Je m'arrache les cheveux
    J'espère que je suis dans le bon sujet
    Merci de votre aide
    Sully

  6. #6
    Nouveau membre du Club
    Homme Profil pro
    Retraité informaticien
    Inscrit en
    Juillet 2007
    Messages
    29
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aude (Languedoc Roussillon)

    Informations professionnelles :
    Activité : Retraité informaticien

    Informations forums :
    Inscription : Juillet 2007
    Messages : 29
    Points : 29
    Points
    29
    Par défaut
    Bonjour, J'ai suivi ce tuto, cela marche sur mon pc Windows mais pas sur ma tablette Android, la fenêtre ne s'affiche pas. Je développe un logiciel pour tablette et navigateur chrome et cette fenêtre permet d'afficher un menu déroulant. Je vous remercie de votre éclairage. Sincères salutation.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
     
    #fixe
    {
       position        : fixed;
        top             : 10%;
        margin-top      : -36px;
        left           : 100px;
    	z-index        : 14;
    }
    #fixe
    {
        background      : #9966FF;
        height          : 200px;
        border-bottom   : 2px solid #d07171;
        width           : 10%;
    }
     
    #fixe p
    {
        margin          : 0;
    }
    Le code html :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <div id="fixe">
     <form method="post" action="goventes(document.modedistribution)" name="modedistribution">
      <select onChange="goventes(document.modedistribution);" name="WE2125f1c925">
      <option selected="selected" value="nolink">Choisir un mode </option>
      <option value="MP">Mains propes</option>
      <option value="BL">Boites aux lettres</option>
      <option value=" ">Remise a blanc</option>
      </select>
    </form>
    </div>

  7. #7
    Membre actif
    Avatar de friendofweb
    Homme Profil pro
    Amateur en informatique
    Inscrit en
    Mai 2015
    Messages
    153
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Amateur en informatique
    Secteur : Santé

    Informations forums :
    Inscription : Mai 2015
    Messages : 153
    Points : 244
    Points
    244
    Par défaut
    Bonjour, j'apprends le développement web et je me pose la question suivante :

    Est-ce qu'il faut encore prévoir des navigateurs comme IE6 et IE7 (nous sommes à IE11)?
    Je me dis que pour que les dernières normes soient utilisées, qu'il faut encourager les utilisateurs à mettre à jour leur système et donc leurs navigateurs.
    Même si, j'ai encore constaté qu'il existe encore des machines qui tournent sous Win XP, j'imagine faute de moyens financier et capacité technique peut-être.

    ex: Certains fax-phone-Internet

    Au fait, merci pour le tuto !
    N'oubliez pas la documentation... - Initiation à HTML5 - Tutos CSS

  8. #8
    Membre actif
    Avatar de friendofweb
    Homme Profil pro
    Amateur en informatique
    Inscrit en
    Mai 2015
    Messages
    153
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Amateur en informatique
    Secteur : Santé

    Informations forums :
    Inscription : Mai 2015
    Messages : 153
    Points : 244
    Points
    244
    Par défaut
    Bonjour, pour info, le lien : commentaires conditionnels du premier paragraphe semble mort..
    N'oubliez pas la documentation... - Initiation à HTML5 - Tutos CSS

Discussions similaires

  1. Position fixed en css
    Par pas30 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 03/02/2009, 11h13
  2. Récupérer le top d'un élément en position: fixed
    Par Maximil ian dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 26/10/2007, 09h54
  3. Menu en position:fixed plus haut que la fenêtre
    Par Maximil ian dans le forum Mise en page CSS
    Réponses: 7
    Dernier message: 15/12/2004, 23h14
  4. Centrer une <div> en position fixe sous IE
    Par Jorus dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 23/09/2004, 15h29

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