지역 사회 배우다 도구 라이브러리 여가
찾다
한국어
집 > 웹 프론트엔드 > JS 튜토리얼 > jQuery_jquery를 기반으로 텍스트 상자 크기 조정 및 상하 이동 기능 구현

jQuery_jquery를 기반으로 텍스트 상자 크기 조정 및 상하 이동 기능 구현

WBOY
풀어 주다： 2016-05-16 16:30:29
원래의
1770명이 탐색했습니다.

웹페이지를 더욱 멋지게 만들고 댓글을 더욱 대화형으로 만들고 싶다면 이 코드를 주의 깊게 연구하세요.

jQuery 코드:

코드 복사 코드는 다음과 같습니다.

$(함수(){
          var $comment = $('#comment')
              $('.bigger').click(function(){
If(!$comment.is(":animated")){
If($comment.height() < 500){
//$comment.height($comment.height() 50)
$comment.animate({높이:" =50"},400)
| ~            })
                $('.smaller').click(function(){
If(!$comment.is(":animated")){
If($comment.height() > 50){
//$comment.height($comment.height() - 50)
$comment.animate({높이:"-=50"},400)
~ ~             })
                $('.up').click(function(){
If(!$comment.is(":animated")){
$comment.animate({scrollTop:"-=50"},400)
~             })
                $('.down').click(function(){
If(!$comment.is(":animated")){
                             $comment.animate({scrollTop:" =50"},400); ~             })
})



HTML 코드:



코드 복사

코드는 다음과 같습니다.


        
& Lt; 스팬 클래스 = "더 크게" & gt; 확대 & lt;/span & gt; & Lt; 스팬 클래스 = "더 작게" & lt;/span & gt; & Lt; 스팬 클래스 = "up" & lt;/span & gt; ~ > > >