2

表のセルを非表示にする方法は知っていますが、瞬く間に発生します。関数が呼び出されたときに、テーブル セルの高さを徐々に小さくしたい。私はJavascriptに非常に慣れていないので、助けていただければ幸いです。

4

2 に答える 2

1

何かをアニメーション化するには、jQueryを使用するのが最も簡単です。jQuery は、人生をより簡単にする Javascript 関数のライブラリです。必要な関数は .animate() です。まず<head>、ページのセクションに次のコード行を追加します。

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>

テーブルを設定し、背を高くしたい行に ID を与えますheightchange(何でもかまいません。この例ではこれを使用しています)。次に、これを HTML ドキュメントの head セクション (上記で追加した行の下) に追加し、次のコードを追加します。

<script type="text/javascript>
    function expandTableRow() {
        $('#heightchange').animate({
            height: '200px'
        });
    }
</script>

次に、次のようにボタンを作成します。

<a href="javascript:expandTableRow();">Click here to expand</a>
于 2012-10-16T02:19:50.370 に答える
0

高さが変化するテーブル セルが 1 つだけであると想像する方法がよくわかりません。しかし、表のセルの内容を表示したいだけでしょうか?

これは css3 トランジションで行うことができます: transition: color 1000ms linear;

==>サンプルコード

于 2012-10-16T02:39:50.110 に答える