2013-11-28 2 views
0

<div>을 플로트하려면 시작하고 아래로 스크롤 할 때는 <div>이 바닥 글에 닿았을 때 중지해야하며 그 반대의 경우도 스크롤해야합니다. this link바닥 글까지 아래로 스크롤 할 때 div를 플로트하려면

if (window_top== div_top){ 
    $arrow.css({position:'fixed',bottom:0,top:"auto"}); 
} 

하지만 내 문제는 내가 영향을 흔들어 얻고있다 :이 코드를 추가하여 그것을 할 수 있어요. 이 떨림 효과를 멈추고 부드럽게 위아래로 스크롤 할 수 있습니까?

+0

, 그 일의 목적은 무엇입니까? http://jsfiddle.net/be2Ff/14/를보십시오. JS와 동일한 금액의 CSS가없는 동일한 결과 – TCHdvlp

+0

안녕하세요, TCHdvlp 님, 고맙습니다. 죄송합니다. 코드에 실수를해서 죄송합니다. http://jsfiddle.net/be2Ff/15/에서 새 코드를 확인하십시오. 흔들리는 효과가 여기에 표시됩니다. 이 떨리는 효과를 멈추고 부드럽게 위아래로 스크롤하고 싶습니다. – user3045602

+0

내 am은 : 아래로 (이 div의 위치는 고정되어 있음) 특정 위치 (예 : 내 바닥 글의 까지)로 스크롤 할 때 원하는 위치에서 div를 플로팅하려고 시도하고 싶습니다. 스크롤했을 때 그 반대의 경우도 마찬가지입니다. up. 나는 그것을 몇 가지 방법을 발견 하고이 jsfiddle의 코드를 찾았어요 그리고 일부는 않았다 내 요구 사항에 따라 수정하지만 떨고 효과 날 죽일. – user3045602

답변

0

자, 이제해야 할 일이 있습니다. 무엇보다도, 흔들리는 동작은 코드에서 완전히 정상적으로 보입니다. 왜냐하면 !!! 스크롤하면 검사 if (window_top > div_top)은 이전 위치를 기반으로합니다. 화살표를 이동하기 전에. 화살표가 바닥 글 밑에 있으면 window_top == div_top이 다음 스크롤을 위해 true가되도록 설정합니다. 당신은 당신이 무엇을해야하는지, 어쨌든 ... 등 ... 당신의 화살표를 이동하므로 다음 스크롤, window_top == div_top는, true가됩니다 :

1 : 글로벌 VAR에 초기 화살표 상단의 위치를 ​​저장

var initialH = $('#arrow').offset().top; 

2 : 최대 고유 스크롤 다운 스크롤

How can I determine the direction of a jQuery scroll event?

3 : 스크롤 다운 동안, 단지

if (window_top > div_top) 
확인

true 인 경우 fixedabsolute으로 바꿀 수 있으며 화살표를 바닥 글에 첨부 할 수 있습니다.

4 :

arrow_top < (arrow_initial_height + $(window).scrollTop()) 경우, 당신은 당신의 화살표 오프셋 원래의 정상을 다시 설정, 다른 작업을 수행 musn't, 그래서 것 원래의 위치입니다 다시 취 스크롤가됩니다. 떨리는 효과를 없애줍니다.

부드럽게 스크롤하려면 어떻게하는지 설명하는 튜토리얼 톤이 있어야합니다.

작업 바이올린 : http://jsfiddle.net/be2Ff/30/ 진심

+0

안녕하세요, TCHdvlp, 더 이상 흔들리는 효과가 없습니다. 다시 고맙습니다. 나는 당신의 모든 4 단계를 따라 갔지만 2 단계에서 의심의 여지가있다. pls이 링크를 확인하십시오 : http://jsfiddle.net/be2Ff/28/ ...... 내가 원하는 것은 화살표가 아래로 내려 가면 원래대로 남아 있어야합니다. 화살표가 원래 위치에 도달했을 때 위치, 항상 노란색 바닥 글에 붙지 말라. ..... 아래로 스크롤 할 때 화살표가 붙어서 위로 스크롤한다. 이렇게. – user3045602

+0

나쁘다. 내 대답을 편집 할게. 4 단계는 다음과 같아야합니다. 위로 스크롤하는 경우 ... 위로 스크롤하면 'window_top> footer_top'이 고정 위치로 돌아갑니다. – TCHdvlp

+0

다른 실수가 있습니다. 나는 바이올린을 편집 할 것입니다. 대답에서 바이올린을 찾으십시오 – TCHdvlp

관련 문제