html文本框上下左右移动,基于jQuery实现文本框缩放以及上下移动功能

想让你的网页更加的炫酷，想让你的留言评论更加的具有互动性吗，那么请仔细研究下本代码吧。

jQuery代码：

$(function(){

var $comment = $('#comment');

$('.bigger').click(function(){

if(!$comment.is(":animated")){

if($comment.height() < 500){

//$comment.height($comment.height() + 50);

$comment.animate({height:"+=50"},400);

}

}

});

$('.smaller').click(function(){

if(!$comment.is(":animated")){

if($comment.height() > 50){

//$comment.height($comment.height() - 50);

$comment.animate({height:"-=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代码：

放大

缩小

向上

向下

水电费水电费爽肤水法萨芬沙发放松放松沙发

当爽肤水飞沙发发沙发发发发

水电费水电费爽肤水法萨芬沙发放松放松沙发

当爽肤水飞沙发发沙发发发发

CSS代码：

.bigger , .down , .up , .smaller{

background-color: #f1a55c;

}

代码奉上，具体如何使用，使用在何处，我就不多说了，小伙伴们自由发挥吧。