Ok, here’s the issue peeps - I’ve created a template using MODx, piece of cake. I publish it then check it out online and for some odd reason some of the images on the page have those broken image link red x’s over-lapping them and are revealing the image alt tags, but only in IE. The weirder thing is that it’s only doing this with some of the images, not all of them. So I’ve compared the img tags of the errored ones to the ones without errors and there’s no difference in syntax. I’ve provided a link to the site if you’d like to see the error happen with your own eyes in all it’s irritating glory. Remember, make sure to test it in IE.
Yea nice site dude.
The problem is still showing on my IE6, seems to be a file called
http://www.247atx.com/x.gif which is missing. When I look for broken links with FF it says its broken, but with 0 broken links. Strange.
Is the file x.gif in the root directory (the same directory as the index.php)?
-
MODX Staff
- 12,272 Posts
Ahhh... that comes from the assets/js/sleight.js file ... which only renders in IE6. You need to add a single-px transparent .gif file named "x.gif" to your site root or you can change the last line of the .js file to reflect the location.
Ryan Thrash, MODX Co-Founder
Follow me on Twitter at @rthrash or catch my occasional unofficial thoughts at thrash.me
It is different code, and somewhat longer.
// USAGE:
// Add to your template or HTML file by adding <script type="text/javascript" src="assets/js/sleight.js">
// to the head of your document or template. Make sure that the transparent GIF file (x.gif) is also
// in the same directory as the sleight.js file, or that you update the path to the file on
// the last line of the code below.
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
document.writeln('<style type="text/css">img, input.image { visibility:hidden; } </style>');
window.attachEvent("onload", fnLoadPngs);
}
function fnLoadPngs() {
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (var i = document.images.length - 1, img = null; (img = document.images[i]); i--) {
if (itsAllGood && img.src.match(/\.png$/i) != null) {
fnFixPng(img);
img.attachEvent("onpropertychange", fnPropertyChanged);
}
img.style.visibility = "visible";
}
var nl = document.getElementsByTagName("INPUT");
for (var i = nl.length - 1, e = null; (e = nl[i]); i--) {
if (e.className && e.className.match(/\bimage\b/i) != null) {
if (e.src.match(/\.png$/i) != null) {
fnFixPng(e);
e.attachEvent("onpropertychange", fnPropertyChanged);
}
e.style.visibility = "visible";
}
}
}
function fnPropertyChanged() {
if (window.event.propertyName == "src") {
var el = window.event.srcElement;
if (!el.src.match(/x\.gif$/i)) {
el.filters.item(0).src = el.src;
el.src = "x.gif";
}
}
}
function dbg(o) {
var s = "";
var i = 0;
for (var p in o) {
s += p + ": " + o[p] + "\n";
if (++i % 10 == 0) {
alert(s);
s = "";
}
}
alert(s);
}
function fnFixPng(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 = "assets/js/x.gif";
}
It is worth pointing out that the .js file has been fixed in the 0.9.5 release to reference an x.gif in assets/js - although whether that works when using fakedirs I do not know. The code quoted above is from a MODx 0.9.5 beta.
).
