2014-07-25 2 views
0

내 페이지 상단에 바가 있습니다. 사용자가 스크롤 과거 700 px JQuery와이 코드를 사용하여 줄에 이전에 숨겨진 로고를 넣을 때 : 좋은 작품Jquery FadeIn 플로트 디비젼을 뒤집습니다.

$(window).scroll(function(){ 
    var posFromTop = $(window).scrollTop(); 

    if(posFromTop > 700){ 
    $('#logo').fadeIn(200, function(){ 
    }); 

    } else { 
    $('#logo').fadeOut(200, function(){ 
    }); 
    } 
}); 

을,하지만 난 때 #logo 나타납니다 푸시 다운 가도록 줄에 링크가 있습니다. #logo이 나타나면 어떻게 링크가 움직이지 않도록 할 수 있습니까?

링크 코드 :

<div class="container-fluid" style='height: 50px; background-color:rgba(242, 244, 247, 0.5); width: 100%; position: fixed; top: 0; left: 0; z-index: 30;'> 
<a href='#' id='logo' style='font-size: 40px;'>logo</a> 
<a href='#t' style='position: absolute; right: 12px;'>Start</a> 

로고 코드 :

#logo{ 
display: none; 
} 

답변

0

당신은 다른 콘텐츠에 영향을 미치는 것을 방지하기 위해 로고를 position: absolute이 필요합니다.

+0

감사하지만 여전히 움직입니다. – user176105

+0

작동중인 코드 예제를 제공 할 수 있습니까? –

+0

js fiddle에서 스크롤하는 방법을 알아낼 수 없다는 점을 제외하고는 확실합니다. http://jsfiddle.net/PwX93/ – user176105

0

모든 스크립트 작업을 수행하기 전에 먼저 두 요소를 모두 표시하고 스크립트가 실행되는 방식으로 정렬 한 다음 스크립트를 실행하십시오.

+0

을 가지고 있다는 사실과 관련이있을 수 있습니다. 나는 왜 로고를 보이고 싶습니까? – user176105

+0

문제는 스크롤 이벤트 때문이 아니라 html/css 문제입니다. #logo와 링크를 모두 보시면 스크롤 이벤트를 호출 할 때 일어나는 것과 동일한 문제가 발생합니다. 따라서 먼저 문제를 해결하고 #logo를 숨김 상태로 설정 한 다음 스크립트를 실행하십시오. – prakashstar42

+0

죄송합니다. 아직도 이해가 안됩니다. 몇 가지 코드를 제공 할 수 있습니까? – user176105