Arrêter flottant collant div sidebar au pied de page (presque de travail)

Je veux obtenir c'est donc la dernière div de ma barre latérale reste collante lorsque la page défile, mais s'arrête au pied de page. Je l'ai presque travailler avec un tutoriel en ligne, mais le calcul des mess quand disqus commentaires charger et il ne va que jusqu'à un certain point.

Voici une version de travail http://jsfiddle.net/k56yR/1/, mais Est-il un moyen facile de faire quelque chose comme calculer le pied de la hauteur et ensuite, dites-lui d'arrêter le défilement loin de la bas de la page?

InformationsquelleAutor Mike Jonas | 2012-05-19
  1. 16

    Je pense que votre problème est que votre $('#footer').offset().top les changements de la valeur après votre disqus commentaires de la charge. Si vous avez besoin de mettre à jour footerTop (et limit basé sur la nouvelle footerTop valeur) après vos commentaires à charge ou à chaque fois que votre événement se déclenche.

    quelque chose comme:

    $(function(){ //document ready
   if ($('#sticky').length) { //make sure "#sticky" element exists
      var el = $('#sticky');
      var stickyTop = $('#sticky').offset().top; //returns number
      var stickyHeight = $('#sticky').height();

      $(window).scroll(function(){ //scroll event
          var limit = $('#footer').offset().top - stickyHeight - 20;

          var windowTop = $(window).scrollTop(); //returns number

          if (stickyTop < windowTop){
             el.css({ position: 'fixed', top: 0 });
          }
          else {
             el.css('position','static');
          }

          if (limit < windowTop) {
          var diff = limit - windowTop;
          el.css({top: diff});
          }
        });
   }
});

    Comme avec la plupart des cas, il existe un plugin jQuery pour cela, comme julianm l'a souligné dans son commentaire, disponible ici. Il prend également en charge un bouchon de valeur, pour arrêter le collant de la boîte dans la position souhaitée.

    • Merci, c'est presque aujourd'hui. Pensé que c'était le cas, mais avec différents navigateurs, il ignore la limite et défile le pied de page. Semble fonctionner à la fois lorsque vous désactivez le cache ou l'actualisation de la page, puis n'est-ce pas pour chaque répétition de la vue. Des idées? Voici un exemple sur le site thecomeupbmx.net/videos/red-bull-empire-of-dirt-practice-edit (c'est pas le mien, je viens de travailler sur elle)
    • J'avais besoin d'une sorte de test pour ce qui échoue toujours. Il pourrait être la mise en cache des navigateurs les vieux js, mais je ne peux pas reproduire ce.
    • Ce plugin jQuery github.com/AndrewHenderson/jSticky (je l'ai vu dans un des commentaires de l'exemple précédent fourni par Mike Jonas) fait exactement ce que je cherchais. Il prend en charge un bouchon de valeur (peut être une classe, ID ou même une valeur numérique) pour arrêter le collant de la boîte dans la position souhaitée.
    InformationsquelleAutor 19greg96