PDA

View Full Version : Resolved IE < 9 jQuery append / appendTo



ggalan
10-17-2011, 09:33 PM
i have this which works well in all browsers including IE9
but IE 8,7,6 has problems with dynamic dom creation. ive read that IE uses appenTo rather than append jQuery but that doesnt seem to fix it.
any suggestions please, thank you



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<meta name="author" content=""/>
<meta name="copyright" content=""/>
<title>jump off rock fall 2011</title>
<link type="text/css" rel="stylesheet" href="css/style.css">
<script src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.onImagesLoad.min.js"></script>
<script>

var surl = "data.json";
var loadedPic = new Object;
var num = 0;

$(document).ready(function() {
$.getJSON(surl, function(rtnData) {

var total = rtnData.data.length - 1;

function loader(num){

loadedPic = rtnData.data[num].img;

var markup = ('<li><img style="display:none;" src="./img/' + loadedPic + '" width="200" height="267"/></li>');
//$("#recieve ul").append(markup);
$(markup).appendTo("#recieve ul");

$('#recieve ul li img').onImagesLoad({
selectorCallback: function(obj) {

$(obj).each(function(){
$(this).fadeIn(200);
});

if(num <= total){
num++;
loader(num);
}
}
});
};//loader

loader(num);// start the loading
});//getJSON
});//document

</script>
</head>
<body>

<div id="recieve"><ul></ul></div>


</body>
</html>


btw, the plugin says it works well in all IE browsers
http://www.cirkuit.net/projects/jquery/onImagesLoad/

ggalan
10-17-2011, 11:31 PM
it seems to go through 1 round of num++ then it stops only in IE < 9

ggalan
10-17-2011, 11:43 PM
fixed

from


$('#recieve ul li img').onImagesLoad({

to


$(markup).onImagesLoad({