Loading Java applet with height set to 100%

Question

Hello,

I have an webpage that displays a java applet. The applet is resized if the window is resized using JavaScript which works fine. The width and height of the applet is set to 100%. When the applet is loading, an image is displayed

image = "preloader.gif"

Using IE 6/7 everything works fine. But in Firefox, the applet has a height of approximately 200 pixels. The width is correct at 100%. Therefore, the preloader image is cut in half. After the applet has loaded and the javascript resizes the page, width and height are set correctly.

If I change the HTML code and use fixed sizes for the applet, the object displays correctly during loading, but cannot be resized afterwards.

Is there any solution to this problem?

Thanks, Daniel

ps I'm using the Object / embed Tag, but the problem is the same if I use the applet tag.

Answer 1

Hard to say without looking at the page. One possibility is the applet loads before the javascript gets run. In which case you could try loading the applet using javascript (instead of coding it directly in the html).

Answer 2

I would advise you to implement a CSS based solution and create the applet with 100% size of the containing div. I use this method, it's simple, solid and cross browser reliable. Is there any reason you can't do this?

Answer 3

I was getting the same kind of short-and-wide applet in Firefox and Opera.

Now I create the applet dynamically, and this allows me to calculate the size of its containing div depending on the viewport size. This leads me to believe that you would get what you want if you used a containing div with a size specified in points and not as 100%.

The code I use to create the applet

function initJavaView() {
    ...
    var viewportHeight = window.innerHeight ? window.innerHeight : 
                                              $(window).height(); 
    var height = viewportHeight - appletArea.offsetTop - 8;
    html = '<div style="width:100%;height:' + height + 'px;">'

    if (!$.browser.msie /*&& !$.browser.mozilla*/){
        html = html + '<object type="application/x-java-applet;version=1.5" ';
    } else {
        html = html +
            '<object ' +
            'classid = "clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" '+
            'codebase = "http://java.sun.com/update/1.5.0/jinstall-1_5-windows-i586.cab#Version=1,5,0,0" ';
    }
    html = html + ' width="100%" height="100%">' +
    ...
    appletArea.innerHTML = html;
};

The code running at http://books.verg.es/elements_of_ux.html?format=java