Faites un défilement div quand j'atteins un certain point

Je veux faire un défilement div (bouton) lorsque j'atteigne un certain point de défilement. J'aimerais également ajouter des classes aux autres éléments de la page. Par conséquent, il ne fonctionne pas. Voici le code que j'utilise pour le défilement, mais je ne sais pas Je le comprend bien. Aidez-moi s'il vous plaît

$(window).load(function () { var nav = get_nav(); if (!(nav.is_msie && nav.ver <= 6)) { var tmp1 = $('#tag_container').css('position'); var cur_w_offset = start_offset = $('#butoni').offset().top; var bp = $('#right_content'); var pt = $('#butoni'); cur_w_offset = $(window).scrollTop(); if (cur_w_offset >= start_offset) { bp.addClass('flyingbuy'); } else { pt.css('top', 'auto'); } if (window.content_center != true || window.c != false) { window.buydeal_forpresent = false; } $(window).scroll(function () { var tmp = $('#tag_container').css('position'); ur_w_offset = $(window).scrollTop(); if (cur_w_offset >= start_offset) { bp.addClass('flyingbuy'); $('#tag_container').css('height', 'auto'); $('#tag_container_bialo').slideDown('slow'); } else { bp.removeClass('flyingbuy'); $('#tag_container').css(({ position: "fixed", height: "101px" })); $('#tag_container_bialo').slideUp('slow'); } if (!window.buydeal_forpresent) { var nvp_panel = $('#right_content'); var nvp_pricetag = $('#butoni'); var bialo_height = $('#tag_container_bialo').height() + 20; var offset_top = nvp_pricetag.offset().top - nvp_panel.offset().top + 16; if (tmp == 'fixed') { $('#gift').css('position', 'fixed'); var left = $('#butoni').offset().left + 223 - 18; $('#gift').css('top', 16 + bialo_height + 'px'); $('#gift').css('left', left + 'px'); } else { $('#gift').css('position', 'absolute'); $('#gift').css('top', offset_top); $('#gift').css('left', '205px'); $('#gift').animate({ top: offset_top + bialo_height }, 400); } } }); } });

J'ai un problème maintenant. J'ai travaillé ici: JsFiddle

Je ne veux pas que le texte div se défile. Lorsque les pages atteignent le niveau du bouton, je veux que le txt montre, glisse vers le bas et bouge avec le bouton. Mais le texte doit être AVANT le bouton. Ne sais pas pourquoi il se développe en glissant vers le bas. La partie coulissante est ok.

Ok, j'ai découvert la partie croissante. Je n'ai pas précisé la hauteur. Je ne sais vraiment pas comment puis-je faire apparaître le txt avant le bouton et glisser ensemble. Comme ceci:

Bouton TEXT

Je ne suis pas à 100% clair sur ce que vous essayez d'atteindre, et il semble y avoir beaucoup de code dans votre publication qui ne concerne pas directement votre question. Voici un morceau de code beaucoup plus simple qui semble faire ce que vous voulez (si j'interprète correctement votre objectif):

Exemple JSFiddle

 $(function(){ var btn = $('.button'); var btnPosTop = btn.offset().top; var win = $(window); win.scroll(function(e){ var scrollTop = win.scrollTop(); if(scrollTop >= btnPosTop){ //we've reached the button btn.css({position:'fixed',top:0,marginTop:0}); }else if(btn.css('position') === 'fixed'){ //if we scroll back up past the button's original position, and the button had previously been changed to its fixed position, we change it back btn.css({position:'',top:'',marginTop:'100px'}); } }); });

Lorsque la page se charge, nous obtenons la position d'origine, par rapport au document, du bord supérieur du bouton. Nous liaisons ensuite l'événement de défilement de la fenêtre vers un code qui vérifie à quelle distance l'utilisateur a défilé ( win.scrollTop() ). Il compare cette valeur à la position initiale du bouton. S'il s'avère être supérieur ou égal à la position d'origine du bouton, cela signifie que le bouton devrait commencer à défiler avec nous en changeant sa position CSS en fixed . Le else if partie renvoie le bouton à sa position d'origine lorsque l'utilisateur fait défiler.

Essayez d'utiliser ceci

 $(window).scroll(function () { var top = $(window).scrollTop(); if(top>879) { $("div").addClass('yourclass'); } });

Ici, 879 reçoit un point de défilement