Javascriptでコンテンツを折りたたむ

私は、私がオンラインでサイトに入れた履歴書のセクションを折りたたむボタンを作ることを考えてきました。私は、セクションを折りたたみ可能にするための慣例があるかどうか、あるいはdivの値を空にして、クリックするだけでdivを埋め込む関数を呼び出す必要があるかどうか、疑問に思っています。

これが最善の方法でしょうか、それとももっと優雅な方法がありますか?

0

2 答え

コンテンツを折りたたむ最も一般的な方法は、CSSプロパティ display none に設定することです。

// to collapse
myElement.style.display="none";
// to expand
myElement.style.display="block";

jQuery を使用している場合は、 非表示 show これを行うにはcode> を参照してください。ボーナスとして、それらに継続時間を渡すこともできます。jQueryはそれをアニメーション化します:

// to collapse with a 1000ms animation
myjQueryElement.hide(1000);
// to expand with a 1000ms animation
myjQueryElement.show(1000);
3
追加された
また、アニメーションのhide/showのjQueryについては、 api.jquery.com/slideToggle を参照してください。
追加された 著者 jli,

折りたたみ可能なdivのために使用する私のお気に入りのスクリプトは、Dynamic Driveのものです。

だけでなく、それは 'かなり'とユーザーフレンドリーですが、それも実装するのは簡単で、使用して、スクリプトはすべての種類の変更を可能に:)

http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

1
追加された
うん、それはただのjQueryの動作です。
追加された 著者 jli,
真実、それはあまりにも多くのjqueryを知っていない人にとって素晴らしい
追加された 著者 Michael Zaporozhets,
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript