jQuery Girl
  1. jQuery Girl
  3. Arrêtez la colonne collante de démarrage une fois qu’elle atteint div
Intereting Posts
Manipulation du menu JQuery lors du redimensionnement pour une mise en page réactive Défilement lisse avec jQuery jQuery: comment inclure la validation dans la fonction ajaxForm? ipad désactiver les options de sélection sans jquery Limiter la sélection de lignes à 3 dans les tableaux de données Elément déplaçable à l’intérieur d’un autre élément déplaçable Calculer les jours ouvrables entre deux jours devrait exclure les jours fériés Défilement automatique après la mise à jour du contenu DIV Que se passe-t-il entre le téléchargement d’un fichier dans un formulaire HTML et sa soumission? Comment faire en sorte qu’une demande AJAX ressemble à une demande normale et normale Validation jQuery: erreur de type non capturé: $ (…) formValidation n’est pas une fonction Les champs de texte de type d’entrée se répètent après avoir décoché la case à cocher Valeurs maximales autorisées entre les balises dans ASP.NET Comment se moquer d’une erreur 501 d’un appel ajax Vérifiez si tous les éléments satisfont à une condition

Arrêtez la colonne collante de démarrage une fois qu’elle atteint div

J’ai simple ligne d’amorçage avec deux colonnes: 

 
 
All the way with you
 
 
 
So happy to go

Grâce à ce script, la colonne identifiant #stay suivra la première colonne de haut en bas: 

 $(document).ready(function() { (function($) { var element = $('#stay'), originalY = element.offset().top; // Space between element and top of screen (when scrolling) var topMargin = 10; // Should probably be set in CSS; but here just for emphasis element.css('position', 'relative'); $(window).on('scroll', function(event) { var scrollTop = $(window).scrollTop(); element.stop(false, false).animate({ top: scrollTop < originalY ? 0 : scrollTop - originalY + topMargin }, 300); }); })(jQuery); });

Voici un exemple: https://jsfiddle.net/16vqvqev/7/ . Je veux accomplir pour arrêter la colonne qui suit une fois qu’elle atteindra la div avec id #stop.

  1. Comment puis-je le faire avec ce js?
  2. J’ai essayé de le faire avec affixe bootstrap mais je ne suis pas allé loin non plus … comment ce serait dans ce cas?

EDIT: Mon site Web contient en fait du contenu avant la ligne avec la colonne collante. Le code ressemble donc à ceci: https://jsfiddle.net/16vqvqev/11/

votre problème est maintenant corrigé avec le léger ajustement de votre déclaration if, au lieu de vérifier la hauteur de la fenêtre, je l’ai fait vérifier la position finale à l’endroit où l’écran s’est déplacé. comme avant

https://jsfiddle.net/dmisorting_aleksejev/16vqvqev/8/ 

  top: scrollTop - originalY + topMargin + element.height() + parseInt(element.css("padding-bottom")) > end ? element.css("top", end - $(element).height() - 60) : scrollTop - originalY + topMargin

au lieu de: 

 top: scrollTop < originalY ? 0 : scrollTop - originalY + topMargin