2010-02-19 5 views
1

내 블로그에 내 댓글을 표시하거나 숨기려면 jquery를 사용하고 있습니다. 나는 코멘트의 수를 표시하는 포스트의 제목 외에 거품을 보여준다. 풍선을 클릭하면 댓글이 게시물 하단에 표시됩니다.jquery 섹션이나 부분으로 이동

내 문제는 게시물이 길면 (일반적으로 경향이있는 경우) 사용자가 게시물 아래에 댓글 섹션이 표시된다는 단서가 없다는 것입니다. 게시물 하단의이 의견 섹션으로 진행할 수있는 방법이 있습니까? 그래서 같은 토글 기능을 사용하고 있습니다 : 사물의

var $j = jQuery.noConflict(); 
     $j(".post-comments").addClass("hidden"); //hide all comments on page 
     $j(".post-comments-count").toggle(
       function() { 
        $j(this).parent().parent().find(".post-comments").removeClass("hidden"); 
        /* alert('should slide down'); 
        $j(this).parent().parent().find(".post-comments").slideDown("slow");*/ 
       }, 
       function() { 
        $j(this).parent().parent().find(".post-comments").addClass("hidden"); 
        /* alert('should slide up'); 
        $j(this).parent().parent().find(".post-comments").slideUp("slow"); */ 
       } 
     ); 

커플 :

  • I 가정 해 봅시다 하나 개의 솔루션 거품의 앵커 태그에 #link 접미사를 추가하는 것? 그러나 문제를 다시 클릭하면 코멘트 섹션을 닫는 데 너무 정확하게 작동하지 않을 것입니다.
  • 네 일단 열어 보면, 대부분의 사람들이 신경 쓰지 않을 상단의 풍선을 클릭하면 댓글 섹션을 다시 닫을 수 있다는 것을 알고 있습니다. 그럼에도 불구하고 나는 그걸로 기꺼이 살고 있습니다. (직접 관련이없는)

나는 때문에 내 JQuery와이 때 워드 프레스에 떨어져 conks 및 백업 미끄러지지 않도록 약간의 BL ** DY 이유 슬라이드 다운 기능 댓글을 달았습니다

  • . 그러므로 곧장 앞으로 클래스를 추가하고 제거합니다. 당신이 살아있는 예를 원하는 경우
  • , 당신은 내 블로그에 그것을 체크 아웃 환영합니다 : kaushikgopal.com/blog

답변

1

(부드러운 애니메이션 포함)에 대해 이야기하고 스크롤을 수행하는 가장 간단한 방법은 아래의 코드입니다 :

분명히
var comment_div = $j(this).parent().parent().find(".post-comments"); 
comment_div.removeClass("hidden"); 

var targetOffset = comment_div.offset().top; 
$j('html,body').animate({scrollTop: targetOffset}, 1000); 

첫 번째 부분은 기존의 클래스 변화의 단지 재 작성이 있지만, 또한 주석을 해제 한 주석 DOM 요소에 대한 참조를 저장합니다.

두 번째 부분은 HTML 본문의 맨 위에서 주석 div의 위쪽까지의 수직 오프셋을 계산합니다. 그런 다음 페이지를 1 초 (또는 1000msec) 이상의 애니메이션 오프셋 위치로 스크롤합니다. targetOffset 값을 조정하여 화면에서 사용자가 스크롤되는 위치를 조정할 수 있습니다.

+0

감사 마크, 솔루션은 매력처럼 작동합니다. 이상한 이유로 comment_div 변수가 토글 링을 수행하는 것처럼 보이지 않습니다. 완전한 selector 태그를 사용하는 경우 - $ j (this) .parent(). parent(). find (". post-comments") - 작동합니다. 이유를 모르겠다. 그것을 알아 내려고 노력할 것입니다. 건배 –

0

당신은 window.location의 해시 속성을 사용하여 자바 스크립트 앵커로 이동 할 수있다. 이렇게하면 주석을 확장 할 때 탐색 할 수 있지만 주석을 닫을 때 탐색하지 않습니다 (또는 기본 게시물 머리글과 같은 다른 앵커 태그로 이동).

관련 문제