名前のような表に基本情報を持つ人のリストを作成する必要があります。その行をクリックすると、クリックされた行と次の行の間で詳細が消費されます。css divテーブルのjQueryでテーブル行を展開する
もっと視覚的な例として、正確にはjExpand jQuery plug-inを参照してくださいが、通常のhtmlテーブルを参照してください。
は、ここで私は新しいdiv要素がアリスとバーナードの間に作成されたアリスの名前をクリックすると、私の目標であるa jsfiddle with the code
です。
この新しいdivは、表の幅でなければなりません。そして、これは大きな問題です。 cssテーブルにcolspanはありません。
私は2番目の絶対divを持つプレースホルダのダミー行を考えていますが、それを行うためのエレガントな方法は実際には分かりません。
これは何か？ http://jsfiddle.net/95aZb/
さらにその逆のように。 正確にそのように：http://www.jankoatwarpspeed.com/examples/expandable-rows/ –
私は何をしたいのjsfiddleです：http://jsfiddle.net/RMkav/2/ あなたが表示されますアリスをクリックして問題を解決してください。 –
最終的にはそれほどエレガントではありませんが、作業しています。
See this jsFiddle （「ロード・詳細」ボタンを使用して、行をクリックしてください）
は、まだいくつかのドローバックは）（代わりにトグルのjQueryのslideToggle（）を使用することを不可能のように、と思っています。 誰かが絶対的に配置された子を持つ要素をスライドさせるソリューションを持っている場合は、教えてください。
私はそれが他の誰かを助けることを願っています:)
溶液におめでとう。あなたができるときは、あなたの答えを「受け入れられた」とマークして、他の人があなたの成功から学ぶかもしれないようにしてください。乾杯〜 –
これは私が今日に遭遇してきた第三「のCSSのdivテーブル」という質問です。答えは「テーブルを使う」です。たぶん
そして、私は表が表形式のデータ用に作成されていることに同意します。divは表の代わりにdivを使うためにどこでも使用することはできません。 これは本当に4列しかない単純なテーブルではありません。 解決策を見つけた後でも（私の答えを見て）、私はテーブルに行くことを考えています。 –
あなたが使用するいくつかのJavaScriptコード？またはhttp://jsfiddle.netのリンク？ – Beniamin
ちょうどあなたがテーブルを使用していない理由は何ですか？ –
Yheaはそれに言及するのを忘れてしまった。 私はあなたにライトバージョンをくれました。しかし明らかに私はそれにはもっと多くのものがあり、 "データの表形式表示"という意味ではテーブルではありません。 たとえば、各行にはナビゲーションパンといくつかのステータス情報があります。 私はテーブルを絶対的に使うことができますが、行を増やすだけのために他の解決策が大歓迎です。 –