bootstrap - comment faire un div toujours visible sur le défilement

J'essaie de trouver un moyen pour afficher un div, apaise visible pour un utilisateur. Défilement.. c'est mon problème, voir:

http://jsfiddle.net/makypl/966Uy/1/

Cette div doit rester en dessous de la div.left2 pendant le défilement vers le bas et obtenir de nouveau à sa position d'origine tout en défilant vers le haut.

    <div id="wrapper">
    <div id="l">
        <div class="left">
            <p class="trigger">Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1</p>
        </div>
        <div class="left2">
            <p class="trigger">Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2</p>
        </div>
        <div class="thisone">
            <p>This one should stay always visible
                <p>
        </div>
    </div>
    <div class="right">
        <p>Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem...</p>

    </div>
</div>

toute suggestion bienvenue
grâce

Jetez un oeil à cette jsFiddle: jsfiddle.net/dKDJz/2
Essayez celui-ci : "stackoverflow.com/questions/1638895/..." Espérons qu'il a aidé 🙂
probablement utiliser affix twitter.github.io/bootstrap/javascript.html#apposer

InformationsquelleAutor | 2013-07-22

jquery twitter-bootstrap

7
```
var top = $('.thisone').offset().top;
$('.trigger').click(function () {
    $('.thisone').css('position','');  
    $('.left2').toggle('slow',function(){
        top = $('.thisone').offset().top;
    });

});



$(document).scroll(function(){
    //calculating the minimal top position of the div
    $('.thisone').css('position','');
    top = $('.thisone').offset().top;

    $('.thisone').css('position','absolute');                 
    $('.thisone').css('top',Math.max(top,$(document).scrollTop()));
 });
```
Cela devrait faire l'affaire.
http://jsfiddle.net/966Uy/11/

Edit:
Fait quelques ajustement à cause d'un bug peut apparaître si l'utilisateur a défilé lors de l'animation.
- ça fonctionne, mais dans votre solution de @nubinub après avoir fait défiler jusqu'à nouveau, .left2 est caché sous .thisone
- Êtes-vous sûr ? Il semble bien fonctionner ici. Peut-être que vous défiler lors de l'animation, mais j'ai corrigé ce bug.
- yep... fonctionne très bien, seulement, après le défilement de l'aube et de nouveau, lors du déclenchement .left2, .thisone reste pour un temps d'animation en vertu de l' .left2. merci @nubinub
- Peut-être slideToggle au lieu de toggle aurait un meilleur regard sur votre navigateur.
InformationsquelleAutor nubinub
11

Utiliser Bootstrap Apposer, voici un exemple : http://bootply.com/62673

InformationsquelleAutor Pascamel

Vous devez vous connecter pour publier un commentaire.