カプセル化されたネイティブ JavaScript ポップアップ レイヤー code_layout とレイヤー

WBOY
リリース: 2016-05-16 18:19:11
オリジナル
1304 人が閲覧しました
コードをコピー コードは次のとおりです:



オプションパラメータを設定しないボックス(默认高200px、宽300px)
通常設定高宽のボックス
高宽自适应コンテンツ高宽のボックス
なし带预ダウンロードアニメ画的ボックス
延迟自动消失的ボックス
タイトル自制的ボックス
不带标题栏的ボックス
不带标题栏关闭按钮的ボックス
带按钮および回调パラメータのボックス

は、Hongru.box.open(con,options) 関数を使用します。パラメータ con は、レイヤの主要なコンテンツを表示します。オプションはオブジェクトであり、パラメータの前に
复制代码代码如下:

{
width:300 //カスタマイズされた、ポップアップ レイヤー本体 (境界線とタイトル バーの幅を除く)、0 の場合に適応します。
height:200//カスタマイズされた、ポップアップ レイヤー本体 (境界線とタイトル バーの高さを除く)、0 の場合に適応されます。
isPre:1 // true または false、プリロードされた背景画像があるかどうか、
time:0 // 自動終了時間を秒単位で遅延させ、0 ではトリガーされません
title:'' // 自動的に終了タイトルを定義します
isBar:1 //true または false、タイトル バーの有無
isShut:1 //閉じるボタンの有無
}

もう 1 つのホングル。 box.ask( con, options,surecall, cancelcall) は、ボタン付きのプロンプト ボックスです。コールバック関数の最初の 2 つのパラメーターは上記と同じで、最後の 2 つのパラメーターは 'confirm' と 'cancel' のコールバック関数です。 ' それぞれ、透明度のグラデーションとサイズを追加する
、透明度のグラデーションのメイン関数は次のとおりです:

showsourceviewsourceprint? alphaAnim:function(obj,destination,direction){
var opacity = Math.round(obj.style.opacity*100); if(opacity == destination){
clearInterval(obj.animing) ;
if(direction == -1){
obj.style.display='none'; ?Hongru.box.alpha(mask,-1,0):content.innerHTML=box.style.backgroundImage='';
}else{
curOptions = {width:_width,height:_height,isPre: isPreload}
obj ==マスク?this.alpha(box,1,100 ):Hongru.box.fill(_content,curOptions);
}
}else{
var n=Math.ceil( (opacity ((destination-opacity)*.5))); n= n==1?0:n;
obj.style.filter='alpha (opacity=' n ')';
}
} ,


ボックス サイズの勾配関数本体は次のとおりです:


コードをコピーします コードは次のとおりです: showsourceviewsourceprint?sizeAnim:function(obj,width,otherW,wFlag,height,otherH,hFlag) {
var objW = obj.offsetWidth-otherW, objH = obj.offsetHeight-otherH;
if(objW == 幅 && objH == 高さ){
clearInterval(obj.sizing); box.style.backgroundImage='none';
content.style.display='block';
}else{
if(objW!=width){
var n = objW ((width -objW)*.5);
obj.style.width = wFlag?Math.ceil( n) 'px':Math.floor(n) 'px';
}
if(objH! =height){
var n = objH ((height-objH)*.5);
obj.style.height = hFlag?Math.ceil(n) 'px':Math.floor(n) ' px';
}
this.pos();
}
},


これ以上はナンセンスです。パッケージをダウンロードするためにソース ファイルを添付してください:
こちらをクリック
良いと思ったら下記をクリックお願いします
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!