ال 'نافذة.فتح ()' تسمح طريقة JavaScript للمطورين بالارتباط بنافذة أخرى داخل صفحة الويب الخاصة بهم. يتم استدعاء هذه النافذة عندما يقوم المستخدم بتنفيذ إجراء محدد.
باختصار، الوظيفة الرئيسية لل 'نافذة.فتح ()' تتمثل الطريقة في فتح نافذة جديدة على صفحة الويب الرئيسية دون إزعاج واجهة صفحة الويب الرئيسية. في بعض السيناريوهات، يتم فتح النافذة الجديدة بنجاح ولكن شريط التمرير لا يظهر على الإطلاق، مما يرسل انطباعًا سيئًا للمستخدمين.
يشرح هذا الدليل السريع عملية إنشاء شريط تمرير عمودي باستخدام طريقة window.open() في JavaScript.
كيفية إنشاء أشرطة تمرير عمودية باستخدام 'window.open()' في JavaScript؟
ال 'نافذة.فتح ()' تضيف الطريقة افتراضيًا شريط تمرير رأسيًا اعتمادًا على طول محتوى صفحة الويب الجديدة وحجم النافذة المفتوحة. إذا كان محتوى صفحة الويب أكبر من حجم النافذة، فسيتم إضافة شريط التمرير افتراضيًا دون تطبيق أي خصائص CSS. ومع ذلك، إذا أراد المطور إضافة شريط تمرير مخصص، فيمكنك اتباع الطرق الموضحة في الأمثلة أدناه.
بناء الجملة
بناء الجملة ل 'نافذة.فتح ()' الطريقة مذكورة أدناه:
نافذة او شباك. يفتح ( طريق , وجهة , winFeat )هنا، 'طريق' هو مسار صفحة الويب التي سيتم فتحها في نافذة جديدة. ال 'وجهة' هو موقع النافذة الجديدة التي ستظهر، ويمكن ضبطها عليه 'فارغ' , 'الأبوين' , 'الذات' أو 'قمة'. المعلمة الثالثة هي 'winFeat' أو ميزات النافذة، وهي توفر قيمًا مختلفة يمكن ضبطها وفقًا للحاجة إلى تخصيص النافذة.
دعونا نلقي نظرة على بعض الأمثلة لإنشاء شريط تمرير عمودي في النافذة المفتوحة حديثًا باستخدام 'نافذة.فتح ()' طريقة.
مثال: استخدام ميزة نافذة 'أشرطة التمرير' باستخدام طريقة 'window.open()'.
في هذه الحالة، 'نافذة.فتح ()' يتم استخدام الطريقة على طول 'أشرطة التمرير' ميزات النافذة لتعيين شريط التمرير العمودي لنافذة مفتوحة حديثًا، كما هو موضح أدناه:
< رأس >< نوع البرنامج النصي = 'نص/جافا سكريبت' >
وظيفة setScroll ( ) {
كان newWin = نافذة او شباك. يفتح ( 'https://linuxhint.com' , 'قمة' , 'العرض=500، الارتفاع=500،أشرطة التمرير=نعم' ) ;
}
النصي >
رأس >
< جسم >
< ص > اضغط على الزر أدناه لفتح مدونة Linuxhint في ملف in - نافذة الشاشة. ص > انقر فوق لي زر >
جسم >
شرح الكود أعلاه:
- لأول مرة 'setScroll ()' يتم تعريف الوظيفة داخل '<النص البرمجي>' بطاقة شعار. يتم أيضًا إنشاء المتغير 'newWin' الذي يحتوي على ملف 'نافذة.فتح ()' الطريقة فيه.
- بعد ذلك، قم بتمرير المعلمة الأولى لصفحة الويب 'رابط' إلى ملف 'نافذة.فتح ()' طريقة. قم أيضًا بتعيين قيمة 'top' للمعلمة الثانية لعرض النافذة الجديدة في الموضع العلوي لمتصفح الويب.
- بعد ذلك، لتخصيص سلوك النافذة، استخدم ميزات النافذة 'عرض' , 'ارتفاع' و 'أشرطة التمرير' لتعيين العرض والارتفاع وشريط التمرير للنافذة على التوالي.
- في النهاية، قم بإنشاء 'زر' العنصر الذي يطلق 'setScroll ()' وظيفة باستخدام 'عند النقر' مستمع الحدث
بعد انتهاء التجميع، يصبح الإخراج كما يلي:
يؤكد الإخراج أن شريط التمرير قد تمت إضافته إلى النافذة التي تم إنشاؤها حديثًا.
المثال 2: ضبط شريط التمرير يدويًا
هناك طريقة أخرى لتعيين شريط التمرير وهي استخدام CSS 'تجاوز ذ' و 'تجاوز-x' خصائص على الصفحة الثانوية التي سيتم فتحها في نافذة جديدة، كما هو موضح أدناه:
< رأس >< نوع البرنامج النصي = 'نص/جافا سكريبت' >
وظيفة setScroll ( ) {
كان newWin = نافذة او شباك. يفتح ( 'https://linuxhint.com' , قمة , 'العرض = 500، الارتفاع = 500، يمكن تغيير حجمه، أشرطة التمرير = 1)؛
}
<الجسم>
اضغط على الزر أدناه لفتح مدونة Linuxhint في النافذة التي تظهر على الشاشة.
انقر فوقيوصف الكود أعلاه:
- أولاً، قم بإنشاء 'setScroll ()' وظيفة، وداخله يستخدم 'نافذة.فتح ()' الطريقة نفسها كما فعلت في المثال أعلاه.
- أضف أيضًا ميزة نافذة إضافية لـ 'يمكن تغيير حجمها' وتعديل قيمة 'أشرطة التمرير' ميزات ل '1' لتعيين شريط التمرير العمودي.
الآن، افتح ملف CSS لصفحة الويب التي تم توفير رابطها كمعلمة أولى لملف 'نافذة.فتح ()' طريقة. في حالتنا، اسم صفحة الويب هو 'لينوكسينت' لذا افتح ملف CSS الخاص به وأدخل الكود التالي فيه:
< أسلوب >لغة البرمجة {
تجاوز - س : مختفي ;
تجاوز - و : آلي ;
}
أسلوب >
خصائص CSS المذكورة أعلاه 'تجاوز-x' و 'تجاوز ذ' قم بإخفاء شريط التمرير الأفقي وقم بتعيين شريط التمرير الرأسي لصفحة HTML بأكملها وفقًا لطول النافذة.
بعد إدراج وتجميع مقتطفات التعليمات البرمجية أعلاه في كلا الملفين، يبدو الإخراج كما يلي:
يُظهر الإخراج أنه تمت إضافة شريط تمرير عمودي إلى النافذة المفتوحة باستخدام طريقة 'window.open()'.
خاتمة
لإنشاء أشرطة تمرير عمودية باستخدام 'نافذة.فتح ()' الطريقة، 'أشرطة التمرير' يمكن ضبط الميزة التي توفرها النافذة على 'نعم' أو '1' . هناك طريقة أخرى تتمثل في فتح ملف CSS أو HTML لصفحة الويب التي تم تمرير رابطها كمعلمة أولى في طريقة 'window.open()' واستخدام CSS هناك 'تجاوز-x' و 'تجاوز ذ' ملكيات. لقد أوضحت هذه المدونة طرق إضافة شريط تمرير عمودي باستخدام طريقة window.open() في JavaScript.