في الفصل السابق، قدمت إمكانية إضافة وحدة تحرير جزئية إلى الصفحة المقنعة. في هذا الفصل، سأقدم الصفحة الرئيسية لعرض طبقة القناع وفتح مربع حوار شبه شفاف. الحوار هو الصفحة الفرعية المنبثقة، div.
الاداءات هي كما يلي:
تنفيذ التعليمات البرمجية المحددة كما يلي:
انسخ رمز الكود كما يلي:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<أتش تي أم أل>
<الرأس>
<TITLE> مستند جديد </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<اسم التعريف = "المؤلف" المحتوى = "">
<اسم التعريف = "الكلمات الرئيسية" المحتوى = "">
<اسم التعريف = "الوصف" المحتوى = "">
</الرأس>
<نمط النوع = "نص/CSS">
<!--
.ميديف {
لون الخلفية: #FFFFFF؛
الحدود: 5px الصلبة #c7c7c7؛
محاذاة النص: مركز؛
ارتفاع الخط: 20 بكسل؛
حجم الخط: 12 بكسل؛
وزن الخط: غامق؛
مؤشر ض: 999؛
العرض: 500 بكسل؛
الارتفاع: 300 بكسل؛
اليسار:50%;
أعلى:50%;
هامش اليسار:-150px!مهم;/*FF IE7 هذه القيمة هي نصف عرضها*/
هامش الأعلى:-60px!مهم;/*FF IE7 هذه القيمة هي نصف ارتفاعها*/
الهامش العلوي:0px;
الموضع: ثابت! مهم؛/* FF IE7*/
الموقف:مطلق؛/*IE6*/
_top: التعبير (eval(document.compatMode &&
document.compatMode=='CSS1Compat') ؟
documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
}
.بج،.popIframe {
لون الخلفية: #666 العرض: لا شيء؛
العرض: 100%؛
الارتفاع: 100%؛
اليسار:0؛
أعلى:20%;/*FF IE7*/
مرشح: ألفا (التعتيم = 50)؛/*IE*/
العتامة:0.5;/*FF*/
مؤشر z:1;
الموضع: ثابت! مهم؛/*FF IE7*/
الموقف:مطلق؛/*IE6*/
_top: التعبير (eval(document.compatMode &&
document.compatMode=='CSS1Compat') ؟
documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2)؛/* www.VeVB.COm IE5 IE5.5*/
}
-->
</نمط>
<النص البرمجي>
وظيفة showDiv(tag,tid,lawyerName){
var light1=document.getElementById(tag);
light1.style.display='block';
document.getElementById('bg').style.display='block';
}
دالة CloseDiv(){
document.getElementById('popDiv').style.display='none';
document.getElementById('bg').style.display='none';
}
</script>
<الجسم>
<div id="popDiv" style="display:none;">
<قبل>
معبد زهر الخوخ (مقتطف من تشانغ شياو سى)
يوجد معبد زهر الخوخ في تاوهواو، وجنية زهر الخوخ تحت معبد زهر الخوخ.
قامت جنية زهر الخوخ بزراعة أشجار الخوخ وقطف أزهار الخوخ مقابل أموال النبيذ.
عندما أكون رصينًا، أجلس أمام الزهور، وعندما أكون في حالة سكر، آتي للنوم تحت الزهور.
سكارى وسكارى، نستيقظ يومًا بعد يوم، وتتفتح الزهور وتتساقط عامًا بعد عام.
أتمنى أن أموت في شيخوختي وأقضي وقتي في شرب الخمر، بدلاً من الانحناء أمام عربتي.
السيارات والغبار والخيول تكفي الأغنياء، والكؤوس والأغصان للفقراء.
إذا قورن الأغنياء والشرفاء بالفقراء والمتواضعين، فإن أحدهما في الأرض والآخر في السماء.
إذا تم مقارنة الزهور والنبيذ بالمركبات والخيول، فسيتعين عليه أن يقود السيارة ولن يكون لدي أي شيء أفعله.
يسخر الآخرون مني لكوني مجنونًا، لكني أضحك من الآخرين لأنهم لا يستطيعون رؤية ما يحدث.
لا توجد مقابر لأبطال المقابر الخمسة، ولا توجد زهور أو نبيذ لزراعة الحقول.
</قبل>
<a href="javascript: CloseDiv()" >إغلاق</a>
</div>
<div id="bg" style="display:none;z-index:100;"></div>
<br/><br/><br/><br/><br/><br/><br/>
<a href="javascript:showDiv('popDiv')" style="font-size:20px;margin-left:100px">يظهر</a>
</الجسم>
</HTML>