Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    New to the CF scene
    Join Date
    Jan 2013
    Thanked 0 Times in 0 Posts

    Image not loaded in javascript handler for image onload method?

    I have a control wrapped in an UpdatePanel that is part of an iframe. The control grows on user's selection and images appear. Correspondingly I have to extend the iframe's height.

    The problem is I get the iframe's height before appearing images are loaded, hence I get the content cutoff. So I have applied a solution suggested here (count the images and on each onload event decrease the counter and when it is zero resize the iframe with new height). The problem is I still get the images cutoff, and I see from Firebug debugger, when in onload handler, that images are still not loaded ! How could it be, it is the handler for the exact event! What is that I am doing wrong here? Did you have the same experience?

    Here is the code section:

    var imgNumber = 0;
    var onImageLoad = function () {
    if (imgNumber == 0) adjustIframeHeight();

    function adjustIframeHeight() {
    var iframe = window.parent.document.getElementById(window.frameElement.id);
    var iframeHeight = getDocHeight(iframe.contentWindow.document);
    iframe.style.height = iframeHeight + "px";

    function endRequest(sender, args) {
    imgNumber = jQuery('.ForBindingOnLoad').length;
    if (imgNumber > 0) {
    jQuery('.ForBindingOnLoad').each(function () {
    var tmpImg = new Image();
    tmpImg.src = jQuery(this).attr('src');
    tmpImg.onload = onImageLoad();
    else {
    and endRequest function is added to execute on every Ajax loading finished with

    Last edited by mr02077; 03-19-2013 at 07:54 AM.


Tags for this Thread

Posting Permissions

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