اعرض موقعك حسب حجم شاشة الزائر

  يجب علي الموقع ان يحترم زواره و ان يقدم لهم الخدمة الافضل , و من هذه ان تعرض موقعك بالشكل الذي يناسب الزائر , لذا من المهم ان تعرض موقعك حسب اعدادات شاشاته و عرضها او ما يسمي الزيلويشن الابعاد ..

سوف تحكم بطريقة العرض عن طريق ملف css , يتغير باستخدام الجي كويري ..

بداية ً كيف يمكن لنا معرفة عرض الشاشة , لامر سهل لنظر ..

function checkWindowSize() {

if ( $(window).width() > 1800 ) {
$('body').addClass('large');
}
else {
$('body').removeClass('large');
}

}

بنظر الي النص البرمجي في الاعلي نستطيع تحديد عرض الشاشة بـ

 $(window).width();

لذا نحن قمنا بفحص اذا كان عرض الشاشة اكبر من 1800 سوف نضيف استايل الي البدي ,غير ذلك نقوم بحذف الاستايل

و هذا ملف ال CSS

#container {
width: 800px;
height: 1000px;
background: #e3e3e3;
margin: auto;
}

/* Change container size for larger windows. */
.large #container {
width: 1000px;
}

#nav {

width: 100%;
height: 100px;
border-bottom: 1px solid white;
background: #999999;

}

.large #nav {
float: left;
width: 200px;
border-bottom: none;
border-right: 1px solid white;
height: 1000px;
}

مشكلة Warning: Cannot modify header information - headers already sent by

هذه المشكلة كثيرة الحدوث , و تحدث بسبب ان Html يعالج قبل ال Headers , و معلوم ان Headers يجب ان تعالج قبل عرض الصفحة فاذا حدث العكس ظهرت هذه المشكلة , و هذا هو السبب الرئيس , هناك اسباب اخري ايضا , مثل common , او الفراغات الغير لازمة ..

و لحل هذه المشكلة انصح بوضوع في بداية الصفحة الكود التالي ..

<?php  ob_start();   ?>

و في نهايتها

<?php  ob_flush();   ?>

في السطر الاول نقوم بتشغيل ال output buffering تخزين البيانات , جميع البيانات حتي تكتمل الصفحة و بذلك نضمن ان الهيدر تم ارسله  ..
بالنسبة السطر الثاني نقوم فعال بارسال البيانات للعرض في الصفحة ..
و بهذه الطريقة تعتبر المشكلة حلت ..