2014-05-16 3 views
0

그래서 나는이 jQuery 코드JQUERY scrollTop 제대로 작동하지

$(document).scroll(function() { 
    var y = $(this).scrollTop(); 
    if (y > 50) { 
     $('.top-bottom').fadeIn(); 
    } else { 
     $('.top-bottom').fadeOut(); 
    } 
}); 
$('.go-top').click(function(event) { 
    event.preventDefault(); 
    $('html, body').animate({scrollTop: 0}, 300); 
}); 
$('.go-bottom').click(function(event) { 
    event.preventDefault(); 
    $('html, body').animate({scrollTop: $(document).height()-$(window).height()}, 300); 
}); 

이 그리고 나는 그것이 HTML의 블록에 관련이

<div class="top-bottom"> 
    <a href="#" class="go-top"><img src="images/image.png" class="arrow"></a> 
    <a href="#" class="go-bottom"><img src="images/image.png" class="arrow"></a> 
</div> 

이미지에 클래스 화살표는 내가 크기를 조정할 수 있도록이다 하지만 근본적으로 나는 그것이 가기를 원할 때 가기를 원할 때, 그리고 그들이하고있는 바둑판이 나타나기를 원할 때, 그러기를 원한다. 그래서 내가 가기를 원할 때 또는 가기를 클릭 할 때, 또는 페이지의 맨 아래에 각각, 그리고 지금 내가 어디에 문제가있어, 내가 이미지를 클릭 할 때마다 그냥 페이지를 다시로드 w # 그것에 덧붙여졌다. 누구나 내가 뭘 잘못하고 있는지 전혀 모르겠다. 나는 오후 내내 그것을 알아 내려고 노력하고 있었고, 그것에 매달려있는 것처럼 보일 수 없었다. 나는 어리석은 실수 일 수도 있고, 실제로는 매우 복잡 할 수도있다. 누가 알겠습니까?하지만 아무도 나를 도울 수 있다면 크게 감사하겠습니다.

편집 : http://jsfiddle.net/3v6yy/이 기본적으로 내 웹 사이트, 나는 내가 잘못 모르는이 작동하지 않습니다 이유는, 화살표 이미지는 일반적으로 내 원본 파일에 있지만 몇 가지 이유로 볼 때 표시입니다 그들은 누군가가 원하는 효과를내는 방법을 아는 경우 여기에 나타나지 않습니다. (위쪽에서 몇 픽셀을 스크롤 할 때 두 화살표를 모두 페이드 인하거나 맨 아래에있을 때 사라지도록 할 수도 있습니다. 그들이 어떤 단추에 따라 페이지의 상단이나 하단으로 이동하도록하십시오.) 나를 도와 줄 수 있다면 전문가의 도움을받을 수있을 것입니다. 학교 프로젝트이며 정말하고 싶습니다. 잘해라. 그래서 일을 끝내는 것 말고는 기본적으로 진행되는 것을 이해할 수 있도록 동시에 간단해야한다.

+0

알다시피, 제대로 작동하고 있습니다 .... http://jsfiddle.net/534tK/ –

+0

아, 잠깐, 올바른 코드인가요? 누군가 내 코드를 편집 한 것 같습니다. 작동하는지 확인해 보겠습니다. – user2979933

+0

좋아, 다른 사람이 내 코드를 편집 했으므로 원래 코드는 사용하지 않았습니다.하지만 내 사이트에서 변경했기 때문에 작동하지 않을 수도 있습니다. 작동하므로 내 사이트에 문제가 있다고 가정합니다. jsfiddle에서 작동합니다. @ TongShen 어쨌든 도움을 주셔서 감사합니다. 무엇이 잘못 되었습니까? – user2979933

답변

0

href 속성에서 '#'을 제거하십시오.

<div class="top-bottom"> 
    <a href="" class="go-top"><img src="images/image.png" class="arrow"></a> 
    <a href="" class="go-bottom"><img src="images/image.png" class="arrow"></a> 
</div> 

JQuery 함수는 click 이벤트를 취하기 때문에 여기에 '#'태그가 필요하지 않습니다.