Search code examples
javascriptjqueryinternet-explorer-6iepngfixdd-belatedpng

Dd_belatedPng issue with content loaded on callback with jquery.fade()


I'm loading some some html into a div through ajax using jquery. Once the content is loaded, I need to fix pngs for ie6, using DD_belatedPNG. Code below -

$("#content").fadeOut(function(){
    $(this).html("<div><p>some text</p><img src='myimage.png' class='dayPosted' /><p>some more text</p></div>").fadeIn( fixIeIssue() ); //The html in this function is for example only, in my app it's populated by ajax. 
})
fixIeIssue = function(){
    if  (window.DD_belatedPNG){
        //alert("for some reason this works if I call an alert here")
        DD_belatedPNG.fix('.dayPosted');
    }
}

The png fix is not working. Oddly, it does work if I call an alert before calling the fix.

I've tried adding a document.ready into the fixIeIssue but that didn't help.

The png fix does work on the initial page load.


Solution

  • Pass function as argument. You also forget about 1st argument of fadeIn(). Try:

    $("#content").fadeOut(function(){
        $(this).html("<div><p>some text</p><img src='myimage.png' class='dayPosted' /><p>some more text</p></div>").fadeIn('slow', fixIeIssue );
    })
    

    Your version would work if fixIeIssue() will return a function, but it doesn't.