টপিকঃ আইই'তে ট্রান্সপারেন্ট পিএনজি ইমেজ
ট্রান্সপারেন্ট ইমেজের জন্য জেপিজি ও পিএনজি ফরমেট ব্যবহার করা হয়। কিন্তু পিএনজি ততটা জনপ্রিয় নয় কারণ ইন্টারনেট এক্সপ্লোরার এটিকে ট্রান্সপারেন্ট দেখাতে পারে না। তবে আই ই ৭ এ সম্ভবত এ সুবিধা যুক্ত করা হয়েছে।
যাহোক, আজকে পিএইচপি এক্সপার্টস গ্রুপের কল্যাণে একটা ছোট্ট চমৎকার স্ক্রিপ্ট পেলাম। এই মাত্র এটি টেস্ট করে দেখলাম জটিল কাজ করছে। অথ্যাৎ আইই'তে পিএনজি ট্রান্সপারেন্ট আসছে।
তাই আপনাদের সাথে কোডটুকু শেয়ার করছি।
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])if ((version >= 5.5) && (document.body.filters))
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
এই কোডটুকু পেজের হেডার সেকশনে জুড়ে দিন। ব্যাস, পেজের সমস্ত পিএনজি ইমেজগুলো (যেগুলো'র ব্যাকগ্রাউন্ড ট্রান্সপারেন্ট করেই করা হয়েছে) সুন্দর ভাবে দেখাবে।
একাধিক ফাইল হলে এই কোডকে কোন .জেএস ফাইলে রেখে প্রতিটি পেজের হেড সেকশনে ইনক্লুড করে দিন। ব্যাস!
ধন্যবাদ।
মূল সাইট: http://homepage.ntlworld.com/bobosola/pnghowto.htm
what to do?