SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Threaded View

  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2006
    0 Post(s)
    0 Thread(s)

    Question Stop script execution until image has loaded...


    I've written a GUI toolkit which can be used like this:

    var btn = new odin.ui.JButton(new odin.ui.ImageIcon("/img/cancel20x20.gif"));
    var pnl = new odin.ui.JPanel(new odin.ui.layout.BorderLayout());
    pnl.add(btn, "south");


    The problem I have is that in order to layout and size the panel and button I need to know the width and height of the image.

    I've tried loading the image width and height using XHR/Servlet/JSON synchronously (so script execution blocks until the request returns) but this causes the browser to freeze for a period of time - which isn't ideal.

    Using a onload event handler on the image seems to be unreliable e.g.

    var img = new Image();

    img.onload = function () {
    ...set the width and height...

    img.src = "img/canel20x20.gif";

    Sometimes this fires other times it doesn't...

    Could any one offer an alternative solution or maybe someone has knowledge of how other toolkits do this (or perhaps the other toolkits don't do this...)

    Any help of advice would be appreciated.

    Oh, and the reason I wrote my own was because 2 1/2 eyars ago there wasn't any Dojo, YUI, EXT, JQuery etc...

    Last edited by wuckfit; Jun 28, 2007 at 08:11. Reason: speeling mistake!!


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts