Position de fixation par rapport au div parent

Est-il possible de fixer un élément de la position par rapport à la div parent, pas la fenêtre du navigateur?

Dire que j'ai:

<div id="pagecontainer">

    <div id="linkspage">

        <div class="sidelinks">
            <a href="#page1" class="link">Link 1</a>
            <p>
            <a href="#page2" class="link">Link 2</a>
            <p>
            <a href="#page3" class="link">Link 3</a>
            <p>
            <a href="#page4" class="link">Link 4</a>
            <p>
        </div>

        <div class="linkscontent">
            content of links page
        </div>

    </div>

    //OTHER PAGES

</div>

Fondamentalement une page avec deux sections, la section de gauche est une liste de liens, tandis que la section droite est le contenu de la page. Je veux que le contenu de défilement, mais les liens restent fixes pour le parent #pagecontainer afin de ne pas défiler lors de la #pagecontainer parchemins, mais ils vont déplacer lorsque j'faites défiler la fenêtre du navigateur.

J'ai déjà essayé le JQuery "fixto" plugin: https://github.com/bbarakaci/fixto. Mais je ne peux pas l'utiliser parce que mes pages de fade in/out et le script de bugs lors de l'élément parent (#pagecontainer) a un alpha de 0, elle pense que l'élément parent est parti et n'a pas de correctif.

Grâce.

source d'informationauteur Windbrand

  1. 30

    Donner le parent position: relativecomme ceci:

    .parent {
    position: relative;
}
.child {
    position: absolute;
    top: 0;
}

    Voir DÉMO.

  2. 1

    J'ai créé ce CodePen pour vous.

    À partir de votre description, il est à la moitié du chemin.

    mais ils vont déplacer lorsque j'faites défiler la fenêtre du navigateur.

    Vous aurez besoin d'utiliser iframe ou une sorte de JavaScript solution.