jQuery プロンプト効果コード Sharing_jquery-jsチュートリアル-php.cn

jQuery プロンプト効果コード Sharing_jquery

WBOY

リリース： 2016-05-16 16:30:55

オリジナル

1476 人が閲覧しました

コード 1:

コードをコピーしますコードは次のとおりです:

コードをコピーしますコードは次のとおりです:

$(関数(){

$(".tooltip").mouseenter(function(e){

This.mytitle=this.title

This.title=""

var a="" this.mytitle "
"

$("body").append(a);

$("div").css({

"top": (e.pageY y) "px",

"left": (e.pageX x) "px"

}).show("fast")

}).mouseout(function(){

this.title= this.mytitle;

$("div").remove();

});

})

学習経験:

大きな偏差が発生するため、p タグの下に div 要素を追加しないでください。

になることが判明しました！上記の
の場合、this と $("this") には違いがあります。 this.title を $("this").attr("title") に書き換えると、次のマウスアウトイベントが保存されたタイトルにアクセスできなくなります

コード 2:

CSSの引用: jqueryui/css/ui-lightness/jquery-ui-1.8.18.custom.css
jsの引用: jqueryui/js/jquery-ui-1.8.18.custom.min.js

コードをコピーしますコードは次のとおりです:

<スクリプト>
$( "#dialog:ui-dialog" ).dialog( "destroy" );

$( "#dialog-message" ).dialog({

身長: 120、
幅: 220、
モーダル: true、
ボタン: {
「いいえ」: function() {
//何かする
$（this）.dialog（ "close"）; },
"はい": function() {
//何かをする
$( this ).dialog( "close" );
}
}
});

コード 3:

JavaScript ポップアップレイヤーコンポーネント easyDialog を使用します

easyDialog を一定期間使用した後、使用中に発生したいくつかの問題をまとめました。最近、時間をかけて元のコードを再構築して最適化し、いくつかの新しい機能を追加しました。オリジナルのバージョンでは、単純なポップアップレイヤーの基本的な機能を実現するだけでしたが、このバージョンでは、基本的な機能を実現するだけでなく、プロジェクトをいかに早く完了するかについても考慮されています。ポップアップレイヤーをより適切かつ効率的にプロジェクトに適用できるようになります。
easyDialog v2.0 の新機能:

1. デフォルトのポップアップレイヤーコンテンツテンプレートを追加しました。単純なアプリケーションの場合は、ポップアップレイヤーコンテンツの構造を記述する必要はなく、いくつかの単純なパラメーターを渡すだけで済みます。本来の使用方法：

コードをコピーしますコードは次のとおりです:

easyDialog.open({

コンテナ: 'demoBox'

});

デフォルトのコンテンツテンプレートを使用すると、コンテナパラメータは次のように使用できます:

コードをコピーしますコードは次のとおりです:

easyDialog.open({

コンテナ: {

ヘッダー: 'ポップアップ レイヤー タイトル',

コンテンツ: 'easyDialog へようこそ : )'、

はいFn : btnFn、

NoFn: true

}

});

表示される効果は以下のとおりです:

デフォルトのコンテンツテンプレートのスタイルを変更したい場合は、ダウンロードしたドキュメント内の easydialog.css ファイルを変更して、希望のスタイルを実現できます。
2. ポップアップレイヤーのユーザーエクスペリエンスを向上させるためにドラッグアンドドロップ効果を追加しました。ポップアップレイヤーのコンテンツをカスタマイズして、ドラッグアンドドロップ効果を簡単に実現できます。
3. キャッシュシステムとマイクロイベント処理システムが内部的に追加され、ポップアップレイヤーのパフォーマンスを向上させるためにポップアップレイヤーのコンテンツもキャッシュされます。
さらに、パラメータの名前が変更され、元の isOverlay が overlay に変更され、元のポップアップレイヤーの各要素の ID も、可能な限り競合を避けるために変更されました。

上記の 3 種類のプロンプトエフェクトは私がよく使用するもので、プロジェクトのニーズに応じて自由に使用できます。