Gestion du positionnement en Javascript

Jacob -  
 Quo -
Bonjour !

J'suis sur un projet de site web et se pose un probleme : je souhaite positionner mon menu (type side bar) de manière fixe, quelque soit le defillement de la page. J'ai beau faire des modifications du CSS je n'arrive pas au résultat souhaité. J'ai essayé :
display : block; 
position: absolute; (et fixed)
Le menu défile toujours...

Je suis partis d'un template, incluant un certain nombre de script .js. Je n'y connais pas grand chose en Javascript, et je me demandais s'il existait des moyens de géré le positionnement en Javascript. Si oui, les quels ? Prennent-ils l'ascendant sur le CSS ?

Bien coridalement,
Roger

3 réponses

  1. Quo
     
    Tu peux modifier le CSS avec le javascript, dans ce cas l'élément prend la dernière valeur qui lui a été fournis.

    Mais si tu as correctement changé en
    position:fixed; 
    et que ça ne marche pas alors il y a un autre script qui redéfinis la position du menu quelque part quelque part. (Absolute ne défile pas avec la page)

    Dans l'ordre :
    - Assure toi bien qu'aucun autre positionnement n'est définis dans un CSS
    - Essaye de mettre
    position:fixed !important; 
    Si ca marche c'est que tu as un autre position dans un fichier CSS
    - Lance ta page en désactivant le javascript, si ca marche cherche et désactive le script qui réécrit le CSS du menu
    - En tout dernier recourt
    document.getElementById("ID du menu").style.position="fixed";
    1
  2. Jacob
     
    J'regarde ça et j'te tiens au courant, merci de ton aide si rapide et précise :)
    0
  3. Jacob
     
    De retour !

    Bon, j'ai checké mon CSS, mise à part ce que je t'ai dit précédemment rien ne concerne le positionnement de ma
    sidebar
    .

    Voici le CSS de cette dite
    sidebar
    #sidebar
    {
    color: #929da4;
    text-shadow: -1px -1px 0px rgba(0,0,0,0.5);
    position: fixed !important;
    top: 1em;
    right: 1%;
    border: 1px solid #000000;
    padding: 1em;
    width: 20%;

    }

    Le CSS contient également :
    html>body .menufixe {
    position: fixed
    }
    A noter que la class
    menufixe
    n'est pas reprise dans le HTML, j'me demande bien c'qu'elle fout encore dans mon CSS...
    Le Javascript présente quelques lignes qui retiennent mon attention :
    window._skel_panels_config = {
    panels: {
    sidePanel: {
    breakpoints: 'mobile',
    position: 'left',
    style: 'reveal',
    size: '250px',
    html: '<div data-action="moveElement" data-args="sidebar"></div>'
    },
    sidePanelNarrower: {
    breakpoints: 'narrower',
    position: 'left',
    style: 'reveal',
    size: '300px',
    html: '<div data-action="moveElement" data-args="sidebar"></div>'
    }
    },
    Nottament la ligne
    breakpoints: 'mobile'


    Je ne l'ai pas précisé avant, mais je travail à l'aide d'un template (qui sur ce coup présente des avantages mais également des inconvénients !)

    bien coridalement
    0
    1. Quo
       
      Le menu a l'air d'être généré par javascript, normal dans ce cas que ton CSS ne s'applique pas.

      Essaye de changer
      position: 'left',
      par
      position: 'fixed',
      Dans le bout de code.

      Sinon essaye d'intégrer le code javascript que je t'ai passé.

      Si ca ne marche pas je ne pourrais t'aider sans disséquer le template (Ce que je ne ferais pas), tu peux essayer de recoder toi même un menu autrement.
      0