امتداد ال png و شفافيتها مع explorer

05‏/09‏/2010





السلام عليكم

إن كنت أحد من يبحث على صور عالية الجودة وصغيرة الحجم 

وذات ميزات لم توجد من قبل فأنت تتحدث عن الصور ذات الإمتداد PNG
 
وبالأخص آخر تطوير وهو png-24 واللذي تفوق على كل الإمتدادات الاخرى

ولكنه ينتظر الدعم من كل المتصفحات

ولكن قد يكون التطور في الأحيان أسرع من الدعم, حيث توجد الأنظمة الجديدة 

التي لا تستخدم بعد لأنها غير مدعومة من كل 

المتصفحات مثلاً. ولكن المبرمجون والمطورون دائماً يسعون

لإيجاد الحلول بإستخدام الموارد المتاحة وحل المشكلة قبل وصول الدعم.

جرب النظر إلى الصورة عن طريق متصفح الفايرفوكس ..

ستلاحظ ان الصورة سليمة من أي خلل وبجودة عالية جداً ..

إذا نحتاج لحل لجعل الإنترنت إكسبلور يتعرف على الصورة بطريقة صحيحة




الحل:

يبدو أن بحث المبرمجين والمطورين قد وجد حلاً ولكن الأصح أن يسمى حل محدود .. وفيما يلي شرح السبب

 









 لكن في الحقيقة الحلول السابقة كلها معقدة

لدالك تطلب مني الأمر البحث عن حل اوضح حتى يسهل وضعه علينا في الموقع او المدونة







شرح كيفية الاستخدام

أولا : من لوح تحكم مدونتك انتقل إلى صفحة التخطيط ثم ثم تصميم   " تحرير HTML "
 
ثانيا : قبل إجراء أي تعديل احفظ نسخة احتياطية من القالب لاستعادتها عند الضرورة. 

ثالثا : ضع علامة في خانة توسيع القوالب .
ابحث عن  هذا الوسم




]]></b:skin>

و نضع قبله تماما هدا الكود




* html img,

* html .png{

position:relative;

behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",

this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",

this.src = "http://a.imageshack.us/img340/6156/transparente.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),

this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",

this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)

);

}






والآن ستظهر كما هي سليمة في متصفح الإنرنت إكسبلور

نجحت التجربة فعلاً الخلفية شفافة..

حل مشكلة الإنترنت إكسبلور يضفي مشكلة في الفايرفوكس

وبالتالي فإن على مدراء المواقع إختيار إحدى الطريقتين حسب مستخدمي مواقعهم


هذا وما زلنا ننتظر أن تدعم جميع المتصفحات هذا الإمتداد الرائع من غير أكواد او فلاتر