ホームページ  >  記事  >  ウェブフロントエンド  >  jQueryベースのメッセージプラグインで右下のポップアップメッセージボックスを実現_jquery

jQueryベースのメッセージプラグインで右下のポップアップメッセージボックスを実現_jquery

WBOY
WBOYオリジナル
2016-05-16 18:12:251249ブラウズ

1.$.messager.lays(width, height);

このメソッドは主にポップアップ ウィンドウの幅と高さを定義するために使用されます。

2.$.messager.anim(type,speed);

このメソッドは主に、ウィンドウが表示される方法と速度を定義します。

$.messager.anim("fade",1000); //fadeInのアニメーションで表示

$.messager.anim("show",1000) //ショーアニメーションで表示

3.$.messager.show(title,text,time);

このメソッドは主に、ウィンドウに表示されるコンテンツと、ウィンドウが非表示になるまでの表示時間を定義します。

デフォルトのタイトルを使用する場合は、タイトルを 0 に設定します。また、タイトルとテキストを HTML コンテンツに設定して表示することもできます。ユーザーにポップアップ ウィンドウの閉じるボタンをクリックしてメッセージ ボックスを閉じてもらいたい場合は、時間を 0 に設定できます。

$.messager.show(0, "これはプロンプトボックスです",5000);

$.messager.show("プロンプト メッセージ","",3000);

メッセージ プラグインの各メソッドの役割を理解すると、具体的な操作は次のとおりです。

1. jquery.js および jquery.messager.js ファイルをページに導入します。

2. ページが読み込まれたら、メッセージ プラグイン内の関数を呼び出して、ウィンドウ サイズ、表示効果、表示内容を設定します。

コードをコピー コードは次のとおりです。

$(function () {
$.messager .lays(200, 200);
$.messager.anim('fade', 1000);
$.messager.show("プロンプトメッセージ", "Script Home",5000);
});

3. 最終的に表示される効果は以下のとおりです。
jQueryベースのメッセージプラグインで右下のポップアップメッセージボックスを実現_jquery
オンライン デモのアドレスhttp://demo.jb51.net/js/jquery.messager/index.html
プラグインのダウンロード: jquery.message.jsパッケージのダウンロード アドレスhttp://www.jb51.net/jiaoben/22351.html

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。