问题描述
我想做一个div（按钮）滚动，当我到达一个特定的滚动点。也要我添加类到页面上的其他元素。实际上它不工作。这是代码Im使用滚动，但我不太明白它。请帮助我
I want to make a div (button) scroll when I reach a certain scrolling point.Also i want to add classes to the other elements on the page.Somehow it isnt working.Here is the code Im using for the scroll,but I dont quite understand it.Please help me
$(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);
}
}
});
}
});
我现在有问题。在这里工作：
t想要文本div滚动这种方式。当页面到达按钮的水平，我想要txt显示，滑下来，并与按钮一起移动。但是，文本需要在按钮之前。我不
I don't want the text div to scroll that way.When the pages reaches at the button's level ,I want the txt to show,sliding down and moving along with the button.But,the text needs to be BEFORE the button.I don't know why it grows when sliding down.The sliding up part is ok.
好吧，我发现了越来越多的部分。我没有指定高度。
我真的不知道如何让txt出现在按钮之前并滑动在一起。喜欢这样：
Ok,i found out the growing part.I didnt specify the height.I really dont know how can I make the txt appear before the button and slide together.Like this:
TEXT
BUTTON
TEXTBUTTON
推荐答案
我不是100％清楚你想要实现的，而且似乎有很多代码在你的帖子中不直接与你的问题有关。这里有一个更简单的代码段，它似乎做你想要的（如果我正确地解释你的目标）：
I'm not 100% clear on what you're trying to achieve, and there seems to be a lot of code in your post that doesn't directly relate to your question. Here's a much simpler piece of code that seems to do what you want (if I'm interpreting your goal correctly):
$(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'});
}
});
});
当页面加载时，我们获得按钮顶边缘相对于文档的原始位置。然后我们将窗口的滚动事件绑定到代码，检查用户滚动的距离（ win.scrollTop（））。它将该值与按钮的原始位置进行比较。如果发现它大于或等于按钮的原始位置，这意味着该按钮应该开始滚动与我们通过更改其CSS 位置到固定。 else if 部分在用户向上滚动时将按钮返回到其原始位置。
When the page loads, we get the original position, relative to the document, of the button's top edge. We then bind the window's scroll event to code that checks how far down the user has scrolled (win.scrollTop()). It compares that value to the button's original position. If it's found to be greater than or equal to the button's original position, that means the button should start scrolling with us by changing its CSS position to fixed. The else if part returns the button to its original position when the user scrolls back up.
这篇关于当我到达某一点时，做一个div滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！