تصميم قائمة أفقية ( يمكن إضافة تأثيرات جافا أو أكواد css )

[أبو الوليد]

http://img.farfosh.com/uploads/farfosh_12973667622.png (http://img.farfosh.com/)

http://img.farfosh.com/uploads/farfosh_12973667531.gif (http://img.farfosh.com/)

1. بسم الله الرحمن الرحيم ، نفتح مساحة عمل 600×210 بيكسل ثم نملأها باللون 232428 #

http://www.abc4web.net/uploaded/8833_01297442205.png (http://www.abc4web.net/vb)

2. نختار أداة المستطيل ونجعل قيمة العرض 548 والإرتفاع 51 ونرسم مستطيل وسط مساحة العمل ليكون شريط تنقل لواجهة الموقع

http://www.abc4web.net/uploaded/8833_11297442205.png (http://www.abc4web.net/vb)

3. نفتح قائمة Blending Options ونعمل على خيار Drop Shadow و Outer Glow

http://www.abc4web.net/uploaded/8833_21297442205.png (http://www.abc4web.net/vb)

http://www.abc4web.net/uploaded/8833_01297442367.png (http://www.abc4web.net/vb)

4. نضيف طبقة جديدة ونختار أداة المستطيل النقطي Rectagular Marquee Tool ثم نرسم تحديد أسفل شريط التنقل ونملأه باللون 020D07 #

http://www.abc4web.net/uploaded/8833_11297442367.png (http://www.abc4web.net/vb)

http://www.abc4web.net/uploaded/8833_21297442367.png (http://www.abc4web.net/vb)

5. نضيف طبقة أخرى ونختار أداة المستطيل النقطي ونرسم تحديد في النصف العلوي من شريط التنقل

http://www.abc4web.net/uploaded/8833_01297442447.png (http://www.abc4web.net/vb)

6. نختار أداة التدرج اللون وليكن التدرج أبيض إلى شفاف ثم نسحب من أسفل إلى أعلى مرة واحدة ثم نخفف الشفافية إلى 40 %

http://www.abc4web.net/uploaded/8833_11297442447.png (http://www.abc4web.net/vb)

7. نختار أداة الكتابة ونكتب مختصرات الوصول إلى محتوى الموقع ، الخط المستعمل في الشرح kingnet وهو موجودة في مكتبة خطوط الإحتراف

8. نضيف طبقة جديدة وبأداة المستطيل النقطي نرسم تحديد حول أحد اختصارات شريط التنقل لنضيف إليه أكواد الجافا أو CSS نملأها باللون الأبيض ثم نخفف درجة الشفافية إلى 10 %

http://img.farfosh.com/uploads/farfosh_12973668671.png (http://img.farfosh.com/)

9. نتيجة الشرح

http://img.farfosh.com/uploads/farfosh_12973668672.png (http://img.farfosh.com/)

أرجوا أن أكون قد وُفقت في التطبيق / لا تنسونا من صالح دعائكم

[المغربي الجديد]

جزاك الله كل خير
وبارك الله بك وفيك الى يوم الدين
عمل رائع رائع جدا جدا
واصل تميزك أخي الحبيب
دروسك كلها أنسخها لأهميتها
جعل الله عملك في ميزان حسناتك
تسلم الايادي
:abc_152:

[البغرامي]

انا ايظا جميع دروسكـ احملها على جهازي على صفحات ويب
جزاك الله عنا كل خير
وجاريـ التطبيق يا مبدعـ

[أبو الوليد]

جزاكم المولى خيرا وبارك فيكم على الإهتمام :abc_022: وفقكم الله لخير ما يحب ويرضى :abc_152:

[abohmam]

جزاك الله خيرا أخى ابا الوليد

درس رائع ماشاء الله

الحمد لله قمت بالتطبيق من قبل :abc_022:

لكن سوف اضع تطبيق بأكواد CSS ان شاء الله

[أبو يوسف]

جزاك الله خيرا أخي أبو الوليد

شرح سهل

.

[إُلقنـآصّ]

جزاكم المولى خيرا وبارك فيكم على الإهتمام

[إُلقنـآصّ]

تسلم ولكن ليش مانقدر ننسخ الشرح ..


ليش احنا العرب دائما نحب الاحتكار ..

حالة مفزعة والله

[أبو فارس]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .