嵌套< div>的jQuery滚动功能 [英] Jquery scroll function for nested <div>

问题描述

我正在尝试为我的网站制作一个导航到相应<div>的导航.相应的divs嵌套在带有max-height和滚动条的另一个div中.那是我的jQuery常常使我失望的时候.

I'm trying to make a nav that scrolls to a corresponding <div> for my site. The corresponding divs are nested inside another div with a max-height and scrollbar. That's when my jquery tends to fail me.

他是我与我的问题相关的另一个问题的提琴手: JSFIDDLE

He's a fiddle from another question that I related to my problem: JSFIDDLE

请注意，当您单击该按钮时，它不会滚动到正确的div，并且在再次单击时会滚动到一个尴尬的位置.

Notice when you click the button, it doesn't scroll to the correct div, and it scrolls to an awkward position when clicked again.

如何使它滚动到正确的div，而再次单击却不会奇怪地向后滚动?谢谢！

How do I get it to scroll to the correct div and not strangely scroll back when it is clicked again? Thanks!

推荐答案

$(".third").offset().top)单击时在1108和0之间切换坐标.这些是每次单击前.third的正确位置.您必须考虑当前滚动位置和.first div的位置.

$(".third").offset().top) alternates coordinates between 1108 and 0 when clicked. These are the correct positions of .third before each click. You have to take into account the current scroll position and the position of the .first div.

用以下内容替换代码的scrollTop行:

Replace the scrollTop line of code with the following:

scrollTop: $(".third").position().top - $('div.nest').position().top + $('div.nest').scrollTop()},

http://jsfiddle.net/pyL62v58/3/

这篇关于嵌套< div>的jQuery滚动功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！