Jquery and image

i need help with this code
am trying to create a photobox where one image fadeout and another in
<div id=“photo”>i have couple of images here</div>
the problem is that all my images are displayed in the box at a time

as if this code is not doing anything

$(document).ready(function() {
rotatePics(1);
});

function rotatePics(currentPhoto) {
var numberOfPhotos = $(‘#photo img’).length;
currentPhoto = currentPhoto % numberOfPhotos;

$(‘#photo img’).eq(currentPhoto).fadeout(function() {

//
$(‘#photo img’).each(function(i) {
$(this).css(‘zIndex’, ((numberOfPhotos - i) + currentPhoto) % numberOfPhotos);
});

$(this).show();
setTimeout(function() {rotatePics(++currentPhoto);}, 4000);
});
}

It looks like you’re trying to adjust the stacking of the images. However, images are inline by default. Do you have the images styled so that they can stack on each other? The images will need to be positioned with CSS for this technique to work, I believe.

yes i have it stack in css like this

#photo {
overflow: hidden;
}

but issue now is that the jquery code is not working in IE