Latest web development tutorials
×

jQuery UI コース

jQuery UI コース jQuery UI 簡単な紹介 jQuery UI ダウンロード jQuery UI 使用 jQuery UI カスタマイズ jQuery UI ワークス

jQuery UI テーマ

jQuery UI テーマ jQuery UI ThemeRoller jQuery UI CSS フレーム API jQuery UI デザインテーマ

jQuery UI コンポーネントライブラリ

jQuery UI コンポーネントライブラリ jQuery UI 拡張ウィジェット jQuery UI メソッド呼び出しウィジェット jQuery UI なぜウィジェットライブラリを使用 jQuery UI ウィジェットライブラリを使用する方法

jQuery UI リファレンスマニュアル

jQuery UI API ファイル API カテゴリ - 特別に良い効果 API カテゴリ - エフェクトコア API カテゴリ - 交互に API カテゴリ - メソッドのオーバーロード API カテゴリ - ウェイ API カテゴリ - セレクタ API カテゴリ - テーマ API カテゴリ - UI コア API カテゴリ - ユーティリティ API カテゴリ - ウィジェット

jQuery UI 例

jQuery UI 例 ドラッグ 場所 スケーリング 選択します シーケンス 折りたたみパネル オートコンプリート プッシュボタン 日付ピッカー ダイアログ メニュー プログレスバー スライダー 回転子 タブ ツールチップボックス 特別に良い効果 ディスプレイ 隠します 切り替え .addClass() .removeClass() .toggleClass() .switchClass() カラーアニメーション 検索します コンポーネントライブラリ

jQueryのUI API - ツールチップボックス部材(ツールチップウィジェット)

カテゴリ

ウィジェット(ウィジェット)

使用法

説明:カスタマイズ、themableツールチップボックス、ネイティブツールヒントボックスを交換してください。

新バージョン:1.9

彼らはテーマ設定できるように、ツールチップボックス(ツールチップ)は、ネイティブのツールチップボックスを交換し、また、様々なカスタマイズができます。

  • アヤックスによる脚注またはインラインで追加のコンテンツを取得するだけのようではなく、他のコンテンツのタイトルだけを表示します。
  • カスタムターゲティングは、例えば、要素のツールヒントボックスを中心に。
  • 警告またはエラー地域の外観をカスタマイズするための追加のスタイルを追加します。

単純にはもっと精神的なそのような外観の可視性を切り替えると比較ツールチップボックスを表示し、非表示にするには、デフォルトの勾配アニメーション、。 これは、することができますshowhideのカスタマイズオプションを。

itemscontentオプションはペースを維持する必要があります。 あなたは1を変更した場合は、他を変更する必要があります。

一般的には、無効要素は、任意のDOMイベントをトリガしません。 私たちはときにツールチップボックスを表示し、非表示にするかを決定するためにイベントをリッスンする必要があるため、そのため、バルーン無効に要素を制御するための適切なツールは、可能ではありません。 これは、jQueryのUIにつながる任意のレベルでツールチップボックスに取り付け無効要素のサポートを保証することはできません。 これは、無効要素の入力を求めるプロンプトを表示する必要がある場合、あなたはネイティブとjQuery UIバルーンツールチップボックスの混合物を使用する必要があることを意味します。

テーマ

ツールチップの箱体(ツールチップウィジェット)を使用してjQueryのUI CSSフレームワークを 、そのスタイルのルックアンドフィールを定義します。 あなたが指定したツールチップのスタイルボックスを使用する必要がある場合は、以下のCSSクラス名を使用することができます。

  • ui-tooltip :ツールチップボックス外側容器。
    • ui-tooltip-content :ツールヒントボックスの内容。

頼ります

追加情報

  • 一部は、いくつかの機能のCSSを必要とし、それ以外の場合は動作しません。 カスタムテーマを作成する場合は、出発点として、ウィジェット指定されたCSSファイルを使用します。

文書にツールチップボックス(ツールチップ)を作成し、イベント・ブローカのtitle属性を持つすべての要素を使用してください。

<!DOCTYPE HTML>
<HTML LANG = "EN">
<ヘッド>
  <メタ文字セット= "UTF-8">
  <タイトル>ツールチップ箱体(ツールチップウィジェット)デモ</タイトル>
  <リンクのrel = "スタイルシート"のhref = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <SCRIPT SRC = "// code.jquery.com/jquery-1.10.2.js"> </スクリプト>
  <SCRIPT SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </スクリプト>
</ HEAD>
<ボディ>
 
<P>
  <a href="#"title="锚描述">アンカーテキストします</a>
  <入力タイトル= "入力ヘルプ」>
</ P>
<スクリプト>
  $(ドキュメント).tooltip();
</スクリプト>
 
</ BODY>
</ HTML>