0

テキストエリアをクリックすると、テキストエリアの高さを 60px に変更し、同時に下にスライドして、すべてが 1 つの滑らかなアニメーションのように見えるようにする必要があります。

これがJSFiddleです：http://jsfiddle.net/MgcDU/6399/

HTML:

<div class="container">
  <div class="well">
      <textarea style="width:462px" placeholder="Comment..."></textarea>
  </div>
</div>

ありがとう。:)

4

4 に答える 4

1

必要なメソッドはanimate()と呼ばれ、十分に文書化されています。

ここでフィドルとして、animate メソッドと focus() および blur() メソッドのデモを行うjQuery コードを作成しました。

jQuery(document).ready(function ($){

    var element = $('.well textarea');
    var orig_height = element.height();
    var new_height = 60;

    // onfocus event handler
    element.focus(function (){
        $(this).animate({height: new_height + 'px'});
    });
    // onblur event handler
    element.blur(function (){
        $(this).animate({height: orig_height + 'px'});
    });
});
于 2013-08-04T01:10:50.973 に答える
1

このようなものですか？

$('#comment').click(function() {

   $(this).css('height', '60px');

});
于 2013-08-04T00:59:31.790 に答える
0

それはアニメイトとしてはるかにうまく機能します...

$("textarea").on('focus',function (e, ui) {
    $(this).animate({
        height: "60px"
    }, 1500);
});

jsFiddle デモ

于 2013-08-04T01:19:24.713 に答える