Results 1 to 2 of 2

Thread: I want a script to run on return from AJAX function

  1. #1
    Join Date
    May 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question I want a script to run on return from AJAX function

    1) Script Name: Dynamic AJAX Content
    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...jaxcontent.htm

    3) Describe problem:

    My problem involves AJAX, IE6, transparent png and in a away a javascript called sleight.js.

    The sleight.js script is used to fix IE6 inability to handle transparent pngs. so the sleight.js script is included on the page and works fine. Under most circumstances.

    this is the script for reference:
    Code:
    /
    **********************************************************
    Sleight
    (c) 2001, Aaron Boodman
    http://www.youngpup.net
    *********************************************************/
    
    if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent)
    {
    // ******* see this line *****
    document.writeln('<style type="text/css">img { 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)
          {
             var src = img.src;
             var div = document.createElement("DIV");
             div.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizing='scale')"
             div.style.width = img.width + "px";
             div.style.height = img.height + "px";
             img.replaceNode(div);
          }
          img.style.visibility = "visible";
       }
    }

    The problem arises after the page is loaded and a link calling the ajax script runs. The content that is being included has img tags. The content is retrieve successfully, but the images don't display. They don't display because of the sleight script (of course without this script the images display, but png's transparency will not be rendered in IE6).

    So my idea of a solution was to add a call to the sleight scipt's fnLoadPngs() at the end of the ajaxpage() function (see snippet below). The code runs but the images are still hidden. Running "javascript:fnLoadPngs()" from the address bar will display the images, so why wont the same thing work when calling the fnLoadPngs fromt he ajaxpage()?

    Code:
    function ajaxpage(url, containerid){
    	var page_request = false
    	if (window.XMLHttpRequest) // if Mozilla, Safari etc
    		page_request = new XMLHttpRequest()
    	else if (window.ActiveXObject){ // if IE
    		try {
    			page_request = new ActiveXObject("Msxml2.XMLHTTP")
    			} 
    		catch (e){
    			try {
    				page_request = new ActiveXObject("Microsoft.XMLHTTP")
    			}
    			catch (e){}
    		}
    	}
    	else
    		return false
    
    	page_request.onreadystatechange=function(){
    		loadpage(page_request, containerid)
    	}
    	page_request.open('GET', url, true)
    	page_request.send(null);
    
    // add sleight function to process pngs and display imgs after request 
    
    	fnLoadPngs();
    }
    I figured that maybe the fnLoadPngs() at the end of the ajaxpage() was running before the content was returned. So how to do I determine it the contents are returned before calling the fnLoadPngs()?

    I hope someone can give me some insight into doing this.

    s.ali

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    You could use the type of scheme outlined here:

    http://www.dynamicdrive.com/forums/s...ad.php?t=13003

    But a much simpler solution might be just to run fnLoadPngs() onload of the images in the Ajax added content. That is if you have access to those pages (you should, Ajax generally doesn't work cross domain):

    Code:
    <img src="some.png" onload="fnLoadPngs();">
    untested.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

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