مصدر الموضوع الاصلي: درس في كيفية جعل صفحة الموقع تتمدد بتمدد شاشة المتصفح

بسم الله الرحمن الرحيم

الحمد لله رب العالمين، والصلاة والسلام على رسوله الكريم ..

:: درس في كيفية جعل صفحة الموقع تتمدد بتمدد شاشة المتصفح ::

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

مثلا تلاحظ هنا ان صفحة منتدى المشاغب تكبر اذا قمت بتكبير شاشة المتصفح وتصغر اذا قمت بتصغيرها .. وتكون على استطالة الصفحة بنسبة 100% ...

كذلك الحال بالنسبة لموقع المشاغب ... فصفحته متمددة ...

طريقة عمل التمدد سهلة للغاية ... واليوم سنقوم بشرحها ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] نحتاج طبعا لبرنامج الفرونت بيج للعمل عليه ...

سنأخذ مثال توضيحي فقط ... ويقاس عليه كل الاشياء الاخرى ...

لنبدأ على بركة الله ...

1) نفتح البرنامج ... ونبدأ بصفحة جديدة

2) نقوم بإدراج جدول مكون من ثلاث خانات بالطول وبالعرض ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

3) على الجدول نقوم بالضغط بالزر الايمن للفأرة .. ونختار خصائص الجدول ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

ثم نجعل الخصائص كما بالصورة ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


لاحظ أننا قمنا بجعل الجدول متمدد بنسبة 100% حتى تكون الصفحة متمددة ..

ستصبح الصفحة هكذا ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

4) الآن سنأخذ بعض الصور كمثال .. وسندرجها بالجدول ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

سنقوم الآن بإدراجها من خلال قائمة إدراج >> إدراج صورة من مجلد

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

لاحظ الصور وأماكن إدراجها ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

ستصبح هكذا ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


5) الآن يبقى لدينا صور مناطق التمدد ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

لجعل الصور متمددة فإننا ندرجها على شكل خلفية .. وليس على شكل صورة .. لاحظ ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

ثم ندرج باقي الصور بنفس الطريقة

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


سيصبح هكذا

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

6) الآن نقوم بسحب أطراف الخلايا ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


لنرى الناتج النهائي ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

------------------------------


الآن دعونا نأخذ مثال بسيط لكيفية اختيار منطقة التمدد ..!

افرض أن لديك مثل هذه الصورة بصفحة الموقع ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


كيف نجعلها تتمدد ...

أولا يجب علينا اختيار منطقة معينة تصلح لأن تكون منطقة تمدد ... لاحظ اختياري في الصورة ..!

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

ثم علينا أن نقسم تلك الصورة الى عدة صور من ظمنها صورة خاصة بمنطقة التمدد ..

الجزء الأيسر:
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

منطقة التمدد:
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

الجزء الأيمن:
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

بعد ذلك نقوم بإدراج الصور .. وكذلك بإدراج صورة منطقة التمدد على شكل خلفية .. لنحصل على شكل متمدد ..

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

مصدر الموضوع الاصلي: درس في كيفية جعل صفحة الموقع تتمدد بتمدد شاشة المتصفح

موضوع رائع شكرا لك

مصدر الموضوع الاصلي: درس في كيفية جعل صفحة الموقع تتمدد بتمدد شاشة المتصفح

دائــمــأ مـتـمـيـز بـمـواضـيـعـك الـرائـعـة

سـلـمـت يـداك عـلـى هـذا الـمـوضـوع الـرائـع

ولا تـحـرمـنـا مـن جـديـدك الـمـبـهـر

تـقـبـل مـرورى فـى صـفـحـاتك الـرائـعـة