I ran into some problems that I don’t want to show these horrible looking red cross images in Internet Explorer when an image doesn’t exists. And it turns out it’s really easy to solve this problem. You can just use the onerror attribute of the img tag. Having jquery, you could really easily just put a $(this).hide(); in the onerror attribute and the image is automatically hidden when it can’t be loaded.

Today I spend some time looking at the best way to communicating between a Flash Object and the Javascript in the page containing the Flash Object. After seeing a lot of out of date solutions I came by this article from Adobe:

Using the External API for Flash–JavaScript Communication

It makes it really easy to do the communication between the two technologies by using the following code in Flash

import flash.external.*;
// The name of a JavaScript function to call 
var callJasFunction:String = "callJavascript";
//parameter 
var msg:String = "Hello. ^^";
// The return value after calling JavaScript 
var returnValue:String = ExternalInterface.call(callJasFunction, msg).toString();
return_txt.text = returnValue;

This post will give a little description about how you could place a footer at the bottom of a HTML page, but because I don’t like the way I am currently doing it, please let me know if you have any better solutions.

The requirements for the footer placement are the following:

• Footer should be at the bottom of the page when the page is higher then the browser viewport.
• Footer should be at the bottom of the browser viewport if the page is smaller then the browser viewport. No scrollbar should be shown.
• Footer has a 100% width
• Browser resizing and AJAX actions in the webpage that change the page height should update the footer position.

At the moment I am using a JavaScript solution that uses the jQuery 1.2.3 library. You can check it out on this page: ilocal.nl.

It uses the following JavaScript and CSS code:

$(window).ready(function() {
  setFooterPosition();
});
$(window).resize(function() {
  setFooterPosition();
});
function setFooterPosition() {
  $("#footer").hide();
  if ($(window).height() - 65 < $("body").height()) {
    $("#footer").css("top", ($("body").height() + 1) + "px");
  } else {
    $("#footer").css("top", ($(window).height() - 65) + "px");
  }  if ($("#header").width() > 996) {
    $("#topbanner").css("width", $("#header").width() + "px");
  } else {
    $("#topbanner").css("width", "996px");
  }  $("#footer").css("width", $(document).width() + "px");
  $("#footer").css("left", "0px");  $("#footer").show();
}

#footer {
  position: absolute;
  display: none;
  height: 53px;
  z-index: 0;
}

Please note that earlier versions of jQuery don’t work with this code, so it’s important to use 1.2.3. You might also notice that there is some difference between the offset height that I am using in the JavaScript, and the height of the footer, this is because I want a small margin between the content on the page and the footer.