"كيفية إنشاء نافذة منبثقة؟" غالبًا ما يطرح هذا السؤال مبتدئو Dreamweaver. ما عليك سوى العثور على موقع ويب يوفر تأثيرات خاصة، أو تنزيل أداة تأثيرات خاصة ولصق الكود! الأمر ليس سهلاً بعد. في الواقع، الطريقة الأسهل هي استخدام Dreamweaver الأكثر استخدامًا. يمكن إكمال النافذة المنبثقة العادية ببضع نقرات فقط. لا تصدق ذلك؟ تعال وانظر! ما عليك سوى اتباع الخطوات التالية ويمكنك بسهولة إنشاء تأثير نافذة منبثقة.
1. أولاً، قم باستدعاء لوحة السلوك من Window->Behaviors في شريط القائمة أو اضغط مباشرة على مفتاح الاختصار Shift+F3.
2. كما هو موضح في الشكل، اضغط على علامة "+" في الزاوية اليسرى العليا من لوحة السلوك لإضافة سلوك، وحدد سلوك "فتح نافذة المتصفح" في القائمة المنبثقة.
3. بعد تحديد السلوك، سينبثق مربع الحوار "فتح نافذة المتصفح"، كما هو موضح في الشكل. ما عليك سوى ملء معلومات النافذة المقابلة في مربع الحوار والنقر فوق "موافق" لإكمال تخصيص النافذة المنبثقة. في
"عنوان URL المراد عرضه": بالنسبة لعنوان صفحة الويب التي تريد عرضها في نافذة جديدة، يمكنك إدخال العنوان مباشرة أو الضغط على زر "تصفح" لتحديده.
"عرض النافذة" و"ارتفاع النافذة": هما عرض النافذة الجديدة وارتفاعها على التوالي، بالبكسل.
"السمات": هي خصائص النافذة.
"شريط أدوات التنقل"، "شريط القوائم"، "شريط أدوات الموقع"، "أشرطة التمرير حسب الحاجة"، "شريط الحالة"، "مقابض تغيير الحجم"
يمثل شريط الأدوات وشريط القائمة وشريط أدوات تحديد المواقع وشريط التمرير ومقبض تغيير الحجم على التوالي. إن تحديد علامة الاختيار أمام الموقع المقابل يعني أن النافذة الجديدة تحتوي على الميزات المقابلة.
"اسم النافذة": هو اسم النافذة المستهدفة. يمكنك اختيار أي واحد، أو يمكنك تحديد اسم النافذة في مجموعة الإطارات. عند إنشاء نافذة منبثقة، فقط أعطها اسمًا عشوائيًا.
بعد الانتهاء من الخطوات السابقة ستصبح لوحة السلوك بهذا الشكل مما يشير إلى أنه سيتم فتح نافذة تصفح جديدة أثناء تحميل الصفحة (onLoad).
وفي الواقع، فإن عملية إضافة السلوكيات في لوحة السلوك هي عملية قيام Dreamweaver بإنشاء تعليمة برمجية لـ Javascript. في الخطوات المذكورة أعلاه، تم إنشاء الكود التالي. تظهر بالخط العريض أدناه، التعليقات بين "< !—" و"-- >" هي التعليقات الخاصة بهذا الجزء من الكود:
<أتش تي أم أل>
<الرأس>
<title>مستند بدون عنوان</title>
< meta http-equiv="Content-Type" content="text/html; charset=gb2312" >
< لغة البرمجة = "جافا سكريبت">
<!--
وظيفة MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</ /script ><!—افتح النافذة بناءً على القيمة التي تم تمريرها -->
<//الرأس>
< body bgcolor = "#FFFFFF" text = "#000000" onLoad = "MM_openBrWindow('yourpage.htm', 'winname','toolbar=yes,location=yes,status=yes, Menubar=yes,scrollbars=yes, يمكن تغيير الحجم = نعم، العرض = 300، الارتفاع = 200 ')" >
<!—قم بتعيين قيمة كل سمة من سمات النافذة المنبثقة، وقم بتمرير القيمة إلى كل معلمة رسمية مقابلة، وقم بتعيين حدث الإطلاق على onLoad-->
تأثير النافذة المنبثقة
</الجسم>
</أتش تي أم أل>
يمكنك فهم الكود أعلاه على النحو التالي: عندما يتم تشغيل حدث onLoad (أي عندما تنتهي الصورة أو الصفحة من التحميل)، يتم استدعاء طريقة MM_openBrWindow() ويتم استدعاء القيمة
"'yourpage.htm', 'winname', 'toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes, resizable=yes,width=300,height=200'"
(تسمى هنا المعلمات الفعلية) قم بتمرير المعلمات الرسمية المقابلة - "theURL، winName، Features" للاستخدام بواسطة window.open(). لاحظ أنه يجب وضع المعلمات الثلاثة ضمن علامات اقتباس مفردة. ومن بين هذه الرموز، الجملة الأكثر أهمية هي:
"window.open(theURL,winName,features)"
ما يعنيه ذلك هو أنه في النافذة المسماة winName، افتح الصفحة على عنوان URL وفقًا للخصائص المحددة بواسطة الميزات.
بعد فهم معنى الكود، يمكننا أن نعرف أنه يمكن كتابة الكود مباشرة بهذا الشكل: أضف <body>
onLoad="window.open('yourpage.htm', 'winname','toolbar=yes, location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes,width=300,height=200' )"
جملة واحدة. لا تختلف طريقة الكتابة هذه عن تأثير إنشاء التعليمات البرمجية تلقائيًا بواسطة Dreamweaver.
نحن نعرف بالفعل معنى المعلمات الثلاث في window.open() - الأول هو عنوان الصفحة التي سيتم عرضها، والثاني هو اسم النافذة المستهدفة، والثالث هو وصف لخصائص مظهر النافذة. نافذة. لن أخوض في تفاصيل حول المعلمتين الأولى والثانية، فلنتحدث عن المعلمة الثالثة. بالنسبة للمعلمة الثالثة، يمكننا الكتابة
"'شريط الأدوات=لا، الموقع=لا، الدلائل=لا،الحالة=لا،شريط القوائم=لا،أشرطة التمرير=لا،يمكن تغيير حجمها=لا، العرض=300، الارتفاع=200، اليسار=100، الأعلى=100'»
هنا، يمثل شريط الأدوات شريط الأدوات، ويمثل الموقع شريط العناوين، وتمثل الدلائل شريط التنقل، وتمثل الحالة شريط الحالة، ويمثل شريط القوائم شريط القائمة، وتمثل أشرطة التمرير شريط التمرير، ويمثل تغيير الحجم مقبض تغيير الحجم، ويمثل العرض والارتفاع عرض وارتفاع النافذة على التوالي، يمثل اليسار والأعلى الموضع الذي تنبثق فيه النافذة.
يمكن ضبط قيم شريط الأدوات، والموقع، والأدلة، والحالة، وشريط القوائم، وأشرطة التمرير، والقيمة القابلة لتغيير الحجم على نعم أو لا أو 1 أو 0. نعم (1) تعني أن النافذة الجديدة تحتوي على هذه الميزة، ولا (0) لا. يجب ملء قيم العرض والارتفاع واليسار والأعلى بالأرقام، والوحدة هي px.
بعد أن قلت الكثير، هل تفهم؟ أليس من السهل إضافة سلوكيات وإنشاء نوافذ منبثقة في Dreamweaver؟ أليس من الصعب كتابة التعليمات البرمجية باليد؟ طالما تدربت أكثر قليلاً، في فترة زمنية قصيرة، ستشعر: اتضح أن إنشاء النوافذ المنبثقة أمر بسيط للغاية!