Jquery_jquery に基づいて個別のシャドウダイアログボックス効果コードを開発する

コードをコピーします コードは次のとおりです: $(function () { $("#open").click(function() { openDialog(a1); //DIV の ID を直接書き込むだけで呼び出します }); } ); var openDialog = function(o) { var ダイアログ = new zzlDialog(o); } var zzlDialog(o) ) { this.init = function() { /* ダイアログの初期化*/ var XBox = ' ＝ ワイ"> > 🎜 > ' $(document.body).append(XBox); ; this.cssInit = function() { /* CSS 初期化*/ $("#wai").css({ "padding": "10px", "background": " #000", "フィルター": "Alpha(Opacity='50')", "位置": "絶対" }); $("#nie").css({ "位置": "絶対" " , "z-index": "1000" }); $("#nie>table").css({ "border": "1px ソリッド rgb(55,119,188)", "border-collapse": "折りたたむ ", "背景": "#fff" }); $("#nie>table>thead>tr").css({ "背景": "rgb(0,94,172)", "color" : "#fff"、"高さ": "30px"、"font-size": "14px"、"font-weight": "bold" }); ( "td").css({ "padding": "5"}); /* ボディ内部の配置*/ $("#nie").css({ "top": "50px" } ); $("#nie").css({ "left": "50px" }); /* 閉じるボタン*/ var $close = $("#nie>table> ; thead").find("td").next("td"); $close.html(" Close "); $close.css({ " text-align": "right", "padding-right": "5px" }); $close.find("span").css({ "font-weight": "normal", "cursor" : "hand" }); $close.find("span").click(function() { new zzlDialog().closes(); }); /* 外部シャドウの追加、位置、合計サイズは内部コンテンツによって制御されます*/ $("#wai").css({ "width": ($("#nie>table").width() 16) "px", "height ": ($("#nie>table").height() 16) "px" }); $("#wai").css({ "top": $("#nie"). Position( ).top - 8 "px", "left": $("#nie").position().left - 8 "px", "z-index": $("#nie").css( "z -index") }); // $("#wai").corner("5px") //角丸 }; this.open = function(); 🎜> this.init(); this.cssInit(); this.shadow = function() { this.event_b_show() ; if (window.attachEvent) { window.attachEvent('onresize', this.event_b); window.attachEvent('onscroll', this.event_b); else { window.addEventListener('resize', this.event_b, false); window.addEventListener('scroll', this.event_b, false); }; this.event_b = function() { var oShadow = $('#mask'); if (oShadow.css("display") != "none") { if ( this.event_b_show) { this.event_b_show(); } }; this.closes = function() { var oShadow = $('#mask' ); oShadow.css({ 'display': 'none' }); $("#wai").remove(); }; this.event_b_show = function() { var oShadow = $('#mask'); oShadow.css({ 'position': 'absolute', 'display': '' , 'opacity': '0.1', 'filter': 'alpha(opacity=10)', 'background': '#000' }); var sClientWidth = 親parent.document.body.offsetWidth : document .body.offsetWidth; var sClientHeight = 親.document.body.offsetHeight; : document.body.offsetHeight; 親.document.body.scrollTop; .scrollTop ) : (document.body.scrollTop document.documentElement.scrollTop); oShadow.css({ 'top': '0px', 'left': '0px', 'width': sClientWidth "px", '高さ ': (sClientHeight sScrollTop) "px" });

Jquery_jquery に基づいて個別のシャドウ ダイアログ ボックス効果コードを開発する

Jquery_jquery に基づいて個別のシャドウダイアログボックス効果コードを開発する