صورة شفافة بداخل تصميمك ! (شرح طريقة بالصور+فديو)

[linnou]

http://www.dzbatna.com/images/icons/iconrote.gif طµظˆط±ط© ط´ظپط§ظپط© ط¨ط¯ط§ط®ظ„ طھطµظ…ظٹظ…ظƒ ! (ط´ط±ط* ط¨ط§ظ„طµظˆط±+ظپط¯ظٹظˆ) (http://www.dzbatna.com/t743240/)




السلام عليكم ورحمة الله وبركاته


كثرت المواضيع الخاصة بشفافية الصور والحلول بالجافا وغيرها من الأكواد البرمجيـة الصعبة والمعقدة والتي تؤدي إلى ثقل في الستايل style أحياناً


بحثت بالمواقع الأجنبيـة والعربيـة لم اجد حل لفكرتي التي كنت بحاجة إليها


لرؤيـة مثال على كلامي
http://des.hardlayers.com/?styleid=1


http://des.hardlayers.com/tuts/shf1.jpg

لتوضيح الفكرة


الخلفية العامة للصفـحة
اللون الأصفر متدرج للأزرق

الخلفيــــة لل Body والذي عرضه 80%
هي لون أبيض شفاف ,, ويمكن أن تكون أي شي آخر شفاف

لتوضيح السر في هذا العمل

نفتح ملف فرونت بيج جديد

ونضع له خلفيـة هذه الصورة

http://des.hardlayers.com/tuts/shf2.jpg

ليصبح شكل الصفحـة بهذا الشكل

http://des.hardlayers.com/tuts/shf3.jpg


الآن
نعمل جدول جديد بالصفحـة ونشيل الحدود البشعــة ونخلي عرضه 70% مثلا ونعمل له توسيط



نفتح الفوتوشوب



عمل جديد
مساحاته كالتالي (مثال) 300×300

ونلونه باللون الأبيض والشفاف متدرج من الأسفل للأعلى ونجعل الشفافية بالشريحة الملونة هذي 50%
بهذا الشكل

http://des.hardlayers.com/tuts/shf1.png



الآن
نجعل هذه الصورة
خلفية للجدول ونكبر الجدول عبر إضافة Enter Enter Enter لكي نرى التأثير النهائي

سيصبح عندنا صفحـة مثل هذي
http://des.hardlayers.com/tuts/shf.html


أتمنى إن الفكرة وصلت

وهذا درس مفصل بالفديو لنفس الموضوع عملته لكم بإمكانكم تنزيله
http://des.hardlayers.com/tuts/shf.rar

حجم الملف مضغوط : 2.7 ميقا بايت ,,, لكن راح ينفعكم كثير



تحياتي لكم ,,
مهند العتيبي