jQueryのEasyUIレイアウト - XPスタイル左側のパネルを作成します
通常の状況下では、左側のWindows XPのエクスプローラのファイルフォルダ、パネル（パネル）は、いくつかの一般的なタスクが含まれています。 このチュートリアルでは、XPの左側のパネルを作成するためのパネル（パネル）のプラグインをeasyuiする方法を示しています。
パネル（パネル）を定義
私たちは、タスクの数を表示するには、これらのパネル（パネル）、いくつかのパネル（パネル）を定義します。 各パネル（パネル）は、少なくとも折りたたみ/展開ツールボタンを持っている必要があります。
コードは以下のとおりです。
<DIVのスタイル= "幅：200pxの;高さ：自動;背景：＃7190E0;パディング：5pxの;"> <DIVクラス= "easyuiパネル"タイトル= "画像のタスク」折りたたみ式=" true "のスタイル="幅：200pxの;高さ：自動;パディング：10pxの; "> スライドショー<BR/>として表示 プリントを注文するオンライン<BR/> 画像を印刷 </ DIV> <BR/> <DIV CLASS = "easyuiパネル"タイトル= "ファイルとフォルダのタスク」折りたたみ式=" true "のスタイル="幅：200pxの;高さ：自動;パディング：10pxの; "> 新しいフォルダ<BR/>を作ります Webにこのフォルダを公開します<BR/> このフォルダを共有します </ DIV> <BR/> <DIVクラス= "easyuiパネル"タイトル= "その他のスポット"折り畳み式崩壊= "真" = "true"のスタイル= "幅：200pxの;高さ：自動;パディング：10pxの;"> ニューヨーク<BR/> マイピクチャ<BR/> マイコンピュータ<BR/> 私のネットワークの場所 </ DIV> <BR/> <DIVクラス= "easyuiパネル"タイトル= "詳細"折り畳み式= "true"のスタイル= "幅：200pxの;高さ：自動;パディング：10pxの;"> マイドキュメント<BR/> ファイルフォルダ<BR/>は 日付が変更された：2010 Oct.3rd </ DIV> </ DIV>
外観のカスタムパネル（パネル）
このビューの外観は、我々が望むものではありません、我々はボタンのアイコンを拡大/パネル（パネル）ヘッダーの背景画像と崩壊を変更する必要がありますのでご注意ください。
それを行うのは難しいことではありません、私たちが行う必要があるCSSのいくつかを再定義することです。
.panel-体{
背景：＃f0f0f0;
}
.panelヘッダ{
背景：#FFFのurl（ '画像/ panel_header_bg.gif'）無リピート右上。
}
.panel-ツール崩壊{
背景：のURL（ 'イメージ/ arrow_up.gif'）無リピート0PXの-3px。
}
{.panel-ツール拡大
背景：のURL（ 'イメージ/ arrow_down.gif'）無リピート0PXの-3px。
}
したがって、使用easyuiカスタムユーザーインターフェイスは非常に簡単です。