Question

我使用名为supersleight的AlphaImageLoader修复程序，使用以下代码：

   var supersleight = function() {

 var root = false;
 var applyPositioning = true;

 // Path to a transparent GIF image
 var shim   = 'images/empty.gif';

 // RegExp to match above GIF image name
 //var shim_pattern = /x\.gif$/i;



 var fnLoadPngs = function() { 
  if (root) {
   root = document.getElementById(root);
  }else{
   root = document;
  }
  for (var i = root.all.length - 1, obj = null; (obj = root.all[i]); i--) {
   // background pngs
   if (obj.currentStyle.backgroundImage.match(/\_.png/i) !== null) {
    bg_fnFixPng(obj);
   }
   // image elements
   if (obj.tagName=='IMG' && obj.src.match(/\_.png$/i) !== null){
    el_fnFixPng(obj);
   }
   // apply position to 'active' elements
   if (applyPositioning && (obj.tagName=='A' || obj.tagName=='INPUT') && obj.style.position === ''){
    obj.style.position = 'relative';
   }
  }
 };

 var bg_fnFixPng = function(obj) {
  var mode = 'scale';
  var bg = obj.currentStyle.backgroundImage;
  var src = bg.substring(5,bg.length-2);
  if (obj.currentStyle.backgroundRepeat == 'no-repeat') {
   mode = 'crop';
  }
  obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + mode + "')";
  obj.style.backgroundImage = 'url('+shim+')';
  obj.style.visibility= 'visible';
 };

 var el_fnFixPng = function(img) {
  var src = img.src;
  img.style.width = img.width + "px";
  img.style.height = img.height + "px";
  img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale')";
  img.src = shim;
  img.style.visibility= 'visible';
 };

 var addLoadEvent = function(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
   window.onload = func;
  } else {
   window.onload = function() {
    if (oldonload) {
     oldonload();
    }
    func();
   };
  }
 };

 return {
  init: function() { 
   addLoadEvent(fnLoadPngs);
  },

  limitTo: function(el) {
   root = el;
  },

  run: function() {
   fnLoadPngs();
  }
     };
    }();

    // limit to part of the page ... pass an ID to limitTo:
    // supersleight.limitTo('header');
    supersleight.init();
    //Från början är opacity'n 100 eftersom jag inte vet om Javascript är påsatt eller inte och därmed inte vet om PNG'arna kommer att
    //bli genomskinliga eller ej. Är Javascript på så gör jag också bakgrunden genomskinlig så att PNG'arnas genomskinlighet inte blir i onödan
    //If-satsen eftersom transparency ej existerar på första-sidan och därigenom ger fel där

    if(document.getElementById('transparency') != null){
     document.getElementById('transparency').style.filter= "alpha(opacity=60)";
     document.getElementById('transparency').style.background = "#cccccc";
     }

我通过HTML文件开头的SCRIPT延迟标记来调用它。当我将脚本和页面上传到服务器时，它工作得很好但是当我在本地尝试时，根本没有显示图像。基本上，脚本使用AlphaImageLoader将背景设置为以前的PNG图像，然后将空像素设置为IMG src。

如果我发表评论：

//img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale')";
//img.src = shim;

图像显示为正常状态，即删除透明度的PNG。不知何故，过滤器在本地完成时不会正确设置背景并将其留空。在Browsershots和IE Netrenderer（ipinfo.info）上尝试这个时，我在Netrenderer得到了相同的结果，即使Browsershots，Microsoft Expression Web Superpreview 3，使用multipleIEs和IETester进行测试也能按照他们应该的方式显示...

有人有个主意吗？

原来是因为我通过file：//访问它，并且所有这些都位于一个文件夹中，其名称中有很多空格和奇怪的字符..不是我认为这很重要但显然，对于这个效果在我的情况下工作，我不能在没有空格和东西的简单语法的文件夹中...也许它更像是一般的资源管理器问题，而不是具体的AlphaImageLoader ...任何想要启发的人我对这件事情多一点欢迎！：）

还有一个更新...我可以通过网络，本地服务器（localhost）和直接通过文件（文件：//或C：//）访问它而不会出现问题。发生以下情况时会发生此问题：

我有一个名称如下的文件夹：

Sirocco v.1.2（已上传100908） PNGfix +bakgrundsfärger_IE5.5-6

当使用其他文件夹名称时，问题从未发生过，所以我试图将其缩小......似乎是

）

符号是导致问题的那个..用它，AlphaImageLoader没有按照它应该的方式填充背景但没有它，背景填充正常......任何人都知道为什么？

Answer 1

AlphaImageLoader使用相对于文档而不是CSS文件的路径。也许这与你的问题有关？

Answer 2

它无效，因为您使用的是file：//而不是http：//，并且浏览器的安全设置不允许您从file运行javascript：//

如果您的PC上尚未设置服务器，我可以推荐XAMPP。

Answer 3

解决方案：我感觉很愚蠢，这与滤镜效果所接收的参数有关。

过滤器的使用如下所示：

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader('source','sizingMethod')

当然，当我继续抨击来源：

Sirocco v.1.2（已上传100908） PNGfix +bakgrundsfärger_IE5.5-6

...过滤器不知道在哪里关闭paranthesis并过早关闭它，因此图像路径不正确，甚至没有包括sizing方法。当然这可以由程序员预见，但我不怪他... cmon我在这里使用什么样的文件夹名称???当然。我不会在真实的情况下使用它们。它只是用于本地存储网站，所以我可以跟踪哪个版本。

<强>解决了！谢谢大家！

AlphaImageLoader修复PNG的在线工作但不在本地

3 个答案: