ホームページ > ウェブフロントエンド > jsチュートリアル > jqueryマスク制御の実装 code_jquery

jqueryマスク制御の実装 code_jquery

WBOY
リリース: 2016-05-16 18:14:10
オリジナル
1384 人が閲覧しました

スタイル コード:

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

#div_maskContainer
{
表示: なし;
}
/*マスクスタイル*/
#div_Mask{
z-index:1000;
filter:alpha(opacity=40);位置: 絶対;
左:0px;
背景色: #D4D0C8;
/*情報の表示スタイル*/
#div_loading >幅:300ピクセル;高さ:60ピクセル;位置:絶対;
ボーダー:1ピクセルアウトセット;
テキスト整列:中央; ;
z-index: 10000;
filter:alpha(opacity=100);!重要
}



js 制御コード:



コードをコピーします

コードは次のとおりです: /**マスク情報制御使用法: 1.mask.css を参照
3.メソッド
var obj=new MaskControl() を呼び出します。 //マスクのプロンプト情報を表示
obj.show("表示されたプロンプト情報");
//マスクのプロンプト情報を非表示
obj.hide(); //プロンプト情報を表示し、自動的に閉じますtimeOut 後 (1000 は 1 秒を表します)
obj.autoDelayHide=function(html, timeOut)
*/
function MaskControl() {
this .show=function(html){
varloader=$("#div_maskContainer");
if(loader.length==0){
loader=$("< div id='div_maskContainer '>
");
$ ("本体") .append(loader);
}
self.loader=loader;
var h=$(window); height();
var divMask=$("#div_Mask");
divMask.css("top",0).css("width",w)。 css("高さ" ,h);
vartipDiv=$("#div_loading");
html=""; ;
loader .show();
var x=(w-tipDiv.width())/2;
var y=(h-tipDiv.height())/2; .css("left ",x);
tipDiv.css("top",y);
this.hide=function(){
varloader=$("# div_maskContainer");
if(loader.length==0) return ;
loader.remove();
},
this.autoDelayHide=function(html,timeOut){
var loader=$(" #div_maskContainer");
if(loader.length==0) {
this.show(html);
}
else{
vartipDiv=$( "#div_loading") ;
tipDiv.html(html);
if(timeOut==unknown) timeOut=3000;
>}

}



関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート