Estoy montando una pagina web y como no, Int. Explorer me da problemas. Os cuento
Tengo una imagen jpg de fondo, en una tabla una imagen png (transparente) con los menús. Me interessa que sea png ya que quiero tener una tipografia concreta. En dreamweaver creo mapas de vinculo encima de cada palabra para abrir páginas (vínculos).
Para resolver el problema conocido del cuadrado azul en imagenes png en explorer he encontrado este scrip (png.js) , que me funciona bien. Pero los links desaparecen misteriosamente.
function PNG_loader() {
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;";
if (img.align == "right") imgStyle += "float:right;";
if (img.parentElement.href) imgStyle += "cursor:hand;";
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--;
}
}
}
window.attachEvent("onload", PNG_loader);
Rebuscando en la web he encontrado este otro scrip (pngfix_map.js) que resuelve este problema (vinculos) pero no el del cuadrado azul.
/*
Correctly handle PNG transparency in Win IE 5.5 and 6.
http://homepage.ntlworld.com/bobosola.
Updated 18-Jan-2005.
Use in <HEAD> section with DEFER keyword
wrapped in conditional comments thus:
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->
This extended version includes imagemap and input image functionality.
It also requires a 1px transparent GIF.
*/
var strGif = "transparentpixel.gif"
var strFilter = "progid:DXImageTransform.Microsoft.AlphaImageLoader"
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
if (img.useMap)
{
strAddMap = "<img style=\"position:relative; left:-" + img.width + "px;"
+ "height:" + img.height + "px;width:" + img.width +"\" "
+ "src=\"" + strGif + "\" usemap=\"" + img.useMap
+ "\" border=\"" + img.border + "\">"
}
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:" + strFilter
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
if (img.useMap) strNewHTML += strAddMap
img.outerHTML = strNewHTML
i = i-1
}
}
for(i=0; i < document.forms.length; i++) findImgInputs(document.forms(i))
}
function findImgInputs(oParent)
{
var oChildren = oParent.children
if (oChildren)
{
for (var i=0; i < oChildren.length; i++ )
{
var oChild = oChildren(i)
if ((oChild.type == 'image') && (oChild.src))
{
var origSrc = oChild.src
oChild.src = strGif
oChild.style.filter = strFilter + "(src='" + origSrc + "')"
}
findImgInputs(oChild)
}
}
}
Es decir, con el scrip -(png.js) soluciono el problema imagen png pero no el problema vínculos
con el scrip -(pngfix_map.js) soluciono el problema vínculos pero no el problema imagen png
Mi conocimiento del lenguaje es bastante limitado, he intentado hacer un nuevo scrip de los dos pero no me sale.
Alguien puede echarme un cable!!
Estaria eternamente agradecida
Gracias
