jQuery와 관련된 질문이 있습니다. 단추를 클릭 할 때 jQuery를 사용하여 토글 된 주석 상자가 있습니다.Jquery 슬라이드 페이지 하단에
내가 겪고있는 문제는 버튼이 페이지 맨 위에 있고 양식이 맨 아래에 있다는 것입니다. 누군가가 버튼을 클릭하면 댓글 상자가 전환되었음을 알 수 없습니다. 양식을 볼 수 있도록 페이지가 바닥으로 끌리는 댓글 제출 버튼을 클릭하면 어떤 방식으로 표시됩니까?
jQuery와 관련된 질문이 있습니다. 단추를 클릭 할 때 jQuery를 사용하여 토글 된 주석 상자가 있습니다.Jquery 슬라이드 페이지 하단에
내가 겪고있는 문제는 버튼이 페이지 맨 위에 있고 양식이 맨 아래에 있다는 것입니다. 누군가가 버튼을 클릭하면 댓글 상자가 전환되었음을 알 수 없습니다. 양식을 볼 수 있도록 페이지가 바닥으로 끌리는 댓글 제출 버튼을 클릭하면 어떤 방식으로 표시됩니까?
당신이 리디렉션 (예 이을 yourformid.) 폼에 ID를 추가 할 수 있습니다 같은 : 에 http : // yoururl #이을 yourformid.
이$('#buttonID').click(function(){
$('html, body').animate({
scrollTop: $('#elementID').offset().top
});
});
그냥 ID로 #elementID
교체 :
<a href="#formone" onclick="showform()">Form</a>
<form id="formone">....</form>
단순히 같은 앵커를 사용하는 형태로 아래로 이동합니다 스크롤하려는 하단에있는 요소의
준비 처리기에 코드를 포장해야합니다 :
$(function(){
$('#buttonID').click(function(){
$('html, body').animate({
scrollTop: $('#elementID').offset().top
});
});
});
:이 페이지에서
간단한 해결책은 button
양식 HTML에 제출 특히 때문에 당신의 button
요소에 a
요소를 변경하고, a
요소로 사용될 수있다 문서 내 탐색. 당신이 a
요소가있을 때
그래서, 같은 귀하의 코멘트 상자 상 ID 속성을 배치 : 다음 이전 a
요소에 HREF 속성을 넣어
<div id="commentBox"></div>
, 값은 #commentBox
해야 요소는 다음과 같이 표시 될 수 있습니다.
<a href="#commentBox" onclick="$('#commentBox').show();">Text</a>
이 솔루션은 브라우저의 기능을 사용하여 o 주석 상자이므로 스크롤하는 데 애니메이션을 구현할 수는 없지만 가장 표준적인 방법 일 수 있습니다.
당신은 앵커를 사용하고 매우 Sarfaz의 대답처럼, 스크롤 애니메이션을 적용 할 수 있습니다 : 좋아
function goToByScroll(id){
$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}
그런 다음 당신이 그것을 호출 할 수 있습니다
<script>
goToByScroll("theIdIWantToGoTo");
</script>
데모 : http://djpate.com/portfolio/scrollTop/
출처 : http://djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/
당신은 내 하루 멋쟁이를 만들어 줘서 고마워. 당신은 jQuery 괴짜가 아님을 실제로 설명합니다. – Shanon
@Shanon : jQuery의'animate' 함수는 매우 유연하여 사용자 정의 애니메이션을 만들 수 있습니다. 여기서 스크롤 할 요소의'top' 위치를 지정합니다. 'animate' 함수는 애니메이션 방식으로 스크롤 할 수있게 도와줍니다. – Sarfraz
감사합니다 sarfraz! – Shanon