[解決済み】テーブルの行でslideDown(またはshow)機能を使用するには?
2022-04-09 18:03:44
質問
テーブルに行を追加して、その行がスライドして表示されるようにしたいのですが、スライドダウン機能はテーブルの行に display:block スタイルを追加しているようで、レイアウトが乱れてしまいます。
この問題を回避する方法はありますか?
以下はそのコードです。
$.get('/some_url',
{ 'val1': id },
function (data) {
var row = $('#detailed_edit_row');
row.hide();
row.html(data);
row.slideDown(1000);
}
);
解決方法は?
テーブル行のアニメーションはサポートされていません。
ChafferとSwedbergによるquot;Learning jQuery"より。
<ブロッククオート
テーブルの行は特に ブラウザは、アニメーションの障害となる。 は異なる値(table-row と ブロック) の可視表示 プロパティがあります。 .hide()と.show() メソッドは、アニメーションを使用しない場合、常に テーブル行で使用するのが安全です。 このため jQueryバージョン1.1.3では、.fadeIn()および .fadeOut()も同様に使用可能です。
tdの内容をdivで囲み、その上でslideDownを使用することができます。アニメーションが余分なマークアップに値するかどうかを判断する必要があります。
関連
-
[解決済み】Chrome Developer ToolsでリソースがDocumentと解釈され、MIMEタイプapplication/jsonの警告で転送される。
-
[解決済み] jQueryでdiv内のspanにテキストを追加する
-
[解決済み] フォーム送信のjQueryが動作しない
-
[解決済み] jQueryでテーブルの行を追加する
-
[解決済み] .css()関数で追加したスタイルを削除するにはどうしたらいいですか?
-
[解決済み] セレクトした要素の外側のHTMLを取得する
-
[解決済み] テーブルの行全体をリンクとしてクリックできるようにするには?
-
[解決済み] CSSを使用してテーブルの行の色を交互に変更しますか?
-
[解決済み] テーブル行<tr>にボーダー底辺を追加する
-
[解決済み] CSS3のborder-radiusプロパティとborder-collapse:collapseが混ざらないのですが。border-radiusを使用して、角を丸くした折りたたみテーブルを作成するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】jQuery.addClassが動作しない。
-
[解決済み】jQueryでクリックされた要素のIDを取得する方法
-
[解決済み] jQueryを使って入力が空かどうかをチェックする
-
[解決済み] jQueryがfadeOutで動作しない
-
[解決済み] ファイルをホストせずにホットリンクできるjQueryのバージョンはどこかにあるのでしょうか?
-
[解決済み] ユーザーがDIVの外側をクリックしたときに、jQueryを使用してDIVを非表示にする
-
[解決済み] AJAXを同期させる(SJAX)にはどうすればよいか
-
[解決済み] jQueryで背景画像をアニメーションで変化させる
-
[解決済み] jQueryを使って下までスクロールさせる
-
[解決済み] Contact Form 7 のフォームで AJAX を有効にする(AJAX ロード後)。