ホームページ >ウェブフロントエンド >jsチュートリアル >jquery.cvtooltip.js jquery_jquery に基づくバブル チップ プラグイン

jquery.cvtooltip.js jquery_jquery に基づくバブル チップ プラグイン

WBOY
WBOYオリジナル
2016-05-16 18:15:59999ブラウズ
はじめに
1. プラグイン名 cvtooltip の cv は ChinaValue の略称で、tooltip はプロンプトです。
2. 新機能に適したプロンプト、ユーザーをガイドするためのプロンプト、インスタントメッセージのプロンプト、操作失敗時のプロンプト(成功したら誰も止めない)などをcssで実装して実行します。画像ファイルは付属しません。
3. これまでに見つかった問題は、Chrome が Chrome で適切に動作しないことです。これは、Chrome が IE や FF とは異なる方法でページを解析するため、jquery の位置やオフセットの戻り値が異なることが原因です。
4. このプラグインはまだ練習の成果であり、間違いは避けられません。

デモの例
1. ページの読み込み中、バブル プロンプトも表示されます。最初の段落に注目してください。
2. ボタンをクリックすると、バブルプロンプトが表示されます。プロンプトは閉じることができず、2 秒後に自動的に消えます。 私はリンクです
3. バブルアクションを閉じた後、閉じる関数を呼び出します。 もう一度クリックしてください

パラメータ
panel: "body", //このパラメータは、バブルプロンプトをロードするためのコンテナです。値が異なると、計算される位置も異なる場合があります
。 selector: "", //位置の計算に使用されるコントロール
方向: 0, //矢印方向
幅: 300, //バブルプロンプトの幅、完全に手動で設定
左: 0, //距離パネルパラメータ 左マージン
トップ: 0, //パネルの上マージンからの距離 パラメータ
遅延: -1, //シャットダウンをミリ秒単位で遅延します。値 0 は即時シャットダウンを意味します
速度: 300, // 閉じるときの効果、フェードアウト速度
close: true, //閉じるボタンを表示するかどうか
callback: function() {
$.noop(); //クリック後のイベントclose
}

使い方とソースコード
これは投稿しません。ページのソース ファイルも JS で非常にわかりやすく書かれています。ここをクリックしてダウンロードしてください。

Pinais
バブルプロンプトを表示する前提として、プロンプトを表示するオブジェクトが存在する必要があります。デフォルトの位置は、ページに基づいて計算されます。内容は変更されましたが、バブルの位置は変更されていないため、プロンプトの目的が失敗します。
この状況に対応して、セレクター コントロールの位置が変化するとバブルも確実に変化するように、セレクター パラメーターが提供されています。
js ファイル パッケージのダウンロード
元のアドレス http://www.cnblogs.com/0417/archive/2010/11/17/1880293.html
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。