المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : كان عندى استفسار عن كيفية عمل اكثر من لون للاستايل


عمرو عبد العزيز
16-08-2010, 12:57 مساءً
بسم الله الرحمن الرحيم

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

خ ــادم الإسلام
16-08-2010, 01:18 مساءً
يتوجب عليك متابعة دروس تعليم تصميم الاستايلات :)

وينقل للقسم المناسب

عمرو عبد العزيز
16-08-2010, 01:37 مساءً
يتوجب عليك متابعة دروس تعليم تصميم الاستايلات :)

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

خ ــادم الإسلام
16-08-2010, 01:43 مساءً
عفواً فهمتك بالغلط

تفضل

أحببت ان أشرح لكم هذه الفكرة وهي تلوين ستايل واحد بأكثر من لون .بحيث تترك للأعضاء باختيار اللون المفضل ..
ملاحظة هذه الحركة شاهدتها في موقع مكتوب
http://www.maktoob.com/
مثال لخيار اختار اللون
http://img517.imageshack.us/img517/741/32228424jj8.png

أو

http://img517.imageshack.us/img517/9494/84292193zn8.png

أو

http://img517.imageshack.us/img517/4577/74625546tl5.png

أو

http://img127.imageshack.us/img127/8053/84094413mh1.png

مثال للنتيجة

http://img156.imageshack.us/img156/558/14515034rm9.jpg

1- درس تمهيدي
حفظ أنماط css بشكل منفصل أي في ملف خارجي لنستطيع التحكم بها بكل حرية
والطريقة شرحها الاخ كتوم ca2oom بالتفصيل
http://www.traidnt.net/vb/showthread.php?t=459222

بعدما تم ايضاح طريقة حفظ ملفات css بشكل منفصل
وكذلك ايضاح الطرق المختلفة لتعديل الروابط
وكذلك ايضاح أهم الفئات والاكواد و الالوان في الستايل
ندخل مرحة التطبيق
المرحلة الاولى :
نبدأ بتكوين أربع ملفات css بألوان مختلفة .و أتقانها يعتمد على شطارتك في لغة css
نضعها مثلا بهذا المسار مثلا
images/Color/blue.css
images/Color/green.css
images/Color/red.css
images/Color/purple.css

المرحلة الثانية :ربط ملفات css بالجافا سكريبت التي تعرف ب stylesheetswitcher

نرفع ملف الجافا styleswitch.js من هذا الموقع
http://www.dynamicdrive.com/dynamicindex9/stylesheetswitcher.htm

او حمل من هنا كليك يمين ..حفظ باسم (http://www.dynamicdrive.com/dynamicindex9/styleswitch.js)

نحفظه في هذا المسار مثلا

images/Color/styleswitch.js


المرحلة الثالثة :

لوحة تحكم المنتدى / التحكم بالستايلات / القوالب الشائعة

في قالب headinclude
ابحث عن
$style[css]واستبدله ب
<link rel="stylesheet" type="text/css" href="images/color/Blue.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="Green-theme" href="images/color/Green.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="Red-theme" href="images/color/Red.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="purple-theme" href="images/color/purple.css" />
في نفس القالب اضف في آخره

<script type='text/javascript' src="images/color/styleswitch.js"></script>احفظ العمل
انتهينا من تعريف ملفات css وملف الجافا للستايل

بقي لنا وصع خيار تلوين للأعضاء .
لدينا خيار اضافته في احد القوالب التالية footer أو header أو navbar
ولدينا أشكال مختلف لادراج الخيار (صور) او (قائمة منسدلة) او (أزرار راديو) او (كتابة)

انا اخترت خيار الصور والتعديل سيكون في navbar
في اول navbar أضف


<br />
لوّن صفحتك<b>
<a href="javascript:chooseStyle('none', 60)" checked="checked"><img alt="" src="images/Color/blue.gif" border="0" width="20" height="20" /></a>
<a href="javascript:chooseStyle('Green-theme', 60)"><img alt="" src="images/Color/green.gif" border="0" width="20" height="20" /></a>
<a href="javascript:chooseStyle('Red-theme', 60)"><img alt="" src="images/Color/red.gif" border="0" width="20" height="20" /></a>
<a href="javascript:chooseStyle('purple-theme', 60)"><img alt="" src="images/Color/purple.gif" border="0" width="20" height="20" /></a>المثال بالمرفقات

عمرو عبد العزيز
16-08-2010, 10:53 مساءً
بارك الله فيك اخى الكريم ....

عماد مسعد
16-08-2010, 11:14 مساءً
يغلق للانتهاء