jQuery UI テーマローラー


ThemeRoller の紹介

ThemeRoller は、jQuery UI を使用してカスタム テーマを設計およびダウンロードするための直感的なインターフェイスを提供する Web アプリケーションです。テーマをカスタマイズするには、jQuery UI ThemeRoller にアクセスしてください。

jQuery UI ThemeRoller は、ボストンの Filament Group, Inc によって設計および開発されました。

9.png

ThemeRoller インターフェイス

ThemeRoller のインターフェイスは、グローバル フォントと角の半径の設定、ウィジェット コンテナのスタイル、クリック可能な要素のインタラクティブな状態、およびオーバーレイとシャドウのさまざまなスタイルで構成されるさまざまなパネルに分かれています。これらのパネルでは、フォント サイズ、色、太さ、背景色とテクスチャ、境界線の色、テキストの色、アイコンの色、角の半径などのさまざまな CSS プロパティを構成できます。

テーマ ギャラリー (ギャラリー): 事前にデザインされたテーマ

ThemeRoller テーマは、パーマネント リンクの URL から表示できます。そこには、選択できる事前にデザインされたテーマがいくつか含まれています。ギャラリーには、アプリケーション インターフェイスの上部にあるタブ バーからアクセスできます。ギャラリーからテーマをプレビューしてダウンロードしたり、テーマを選択して「Roll Your Own」タブに切り替えて調整したりすることもできます。

テーマをダウンロード

テーマをデザインしたら、プロジェクトで使用するテーマをダウンロードできます。 ThemeRoller の上部には [テーマのダウンロード] ボタンがあり、すべてのテーマ関連ファイルを含む zip パッケージを生成できます。ダウンロード内の画像は仕様に合わせて生成され、高品質の PNG ファイルとして保存されます。

テーマには、すべてのプラグインの画像と CSS を含む、jQuery UI CSS フレームワークのカスタム バージョンを構成する画像と CSS が含まれます。

プロジェクトでダウンロードしたテーマに従います

テーマをダウンロードし、解凍すると、themes 的文件夹。该文件夹包括了主题所需的 CSS 和图像。复制主题文件夹到您的项目中,并在页面中链接 themes/all.cssという名前のファイルが表示されます。

カスタムの「ThemeRoller 対応」コンポーネントを作成する

10.png

ThemeRoller は、独自の ThemeRoller 対応 jQuery コンポーネントを開発するための jQuery UI CSS フレームワークのカスタマイズされたバージョンを生成します。このフレームワークを通じて生成されたクラスは、状態、アイコン、さまざまな補助クラスなどの共通のユーザー インターフェイス設計条件を提供するように設計されています。

jQuery UI CSS フレームワークの開発の詳細については、Theming API ドキュメントをご覧ください。

ThemeRoller リンク