问题
My code at the moment is here: http://www.jaygeorge.co.uk/gwennan-sage
You'll see two green arrows that are in a fixed position at the bottom of the page. I'm having trouble getting jQuery to hide these divs (#timeline-buttons) when the Timeline section is NOT in view, preferably using the fade() technique.
I've tried a Viewport plugin but can't get it to work properly with if statements, I'm sure it can be done with normal jQuery by measuring div heights somehow.
Any advice appreciated, thanks in advance.
回答1:
Hide the green arrows and then onscrolling, test to see if the timeline div position is greater than the window height plus scrolling offset. If greater then that means that the timeline div is in view and the arrows should be shown.
Here is a quick fiddle demonstrating the effect: http://jsfiddle.net/EADDt/
回答2:
Move these arrows into #gwennan-header and remove the fixed css attribute and set the z-index. That way you won't need any Javascript at all.
来源：https://stackoverflow.com/questions/6031649/jquery-show-hide-div-when-section-is-in-viewport