Слайдшоу Jquery проблема с IE

[neokeh]

в firefox, chrome i opere все работает а в IE показывает overflow:scroll;
overflow hidden не работает, как исправить скрипт для работы с IE
код

$(document).ready(function(){
var currentPosition = 0;
var slideWidth = 800;
var slides = $('.slide');
var numberOfSlides = slides.length;	
//zadaem overflow hidden chtobi nebilo skrola
$('#slidesContainer').css('overflow', 'hidden');

 slides
  .wrapAll('<div id="slideInner"></div>')
  // Float left to display horizontally, readjust .slides width
  .css({
    'float' : 'left',
    'width' : slideWidth
  });
$('#slideInner').css('width', slideWidth * numberOfSlides);
$('#slideshow')
	.prepend('<span  class="control" id="leftControl">Move Left</span>')
	.append('<span class="control" id="rightControl">Move Right</span>');

manageControls(currentPosition);

$('.control')
	.bind('click', function(){
		currentPosition = ($(this).attr('id') == 'rightControl') ? currentPosition+1 : currentPosition-1;
		
		manageControls(currentPosition);
		$('#slideInner').animate({
				'marginLeft' : slideWidth*(-currentPosition)
			
			});
	});



function manageControls(position){
	if (position==0){ $('#leftControl').hide()}
	else { $('#leftControl').show()}
			
	if (position==numberOfSlides-1){
		$('#rightControl').hide()}	
	else{ $('#rightControl').show()}
	
	
}

});

HTML

,<div id="slideshow">
                  <div id="slidesContainer">
                    <div class="slide">
                        <h1>We creatign a web sites</h1>
                        <p> if you are interested to make a one please contact <a href="">this</a> form, <img src="images/img_slide_01.jpg" alt="ffs" align="right" /> </p>
                        
                    </div>
                    <div class="slide">
                            <h1>eeeeE</h1>
                        <p> if you are interested to make a one please contact <a href="">this</a> form, <img src="images/img_slide_02.jpg" alt="ffs" align="right" />for more information go to </p>
                    </div>
                    <div class="slide">
                                <h1>WqqqG</h1>
                        <p> if you are interested to make a one please contact <a href="">this</a> form, <img src="images/img_slide_03.jpg" alt="ffs" align="right" />for more information go to </p>
                    </div>
                    <div class="slide">
                                <h1>YwweD</h1>
                        <p> if you are interested to make a one please contact <a href="">this</a> form, <img src="images/img_slide_04.jpg" alt="ffs" align="right" />for more information go to  </p>
                    </div>
                  </div>
                </div>

CSS

#slidesContainer{
	margin:0 auto;
	width:800px;
	height:310px;
	overflow:auto;
	position:relative;
}
#slideshow #slidesContainer .slide{
	margin:0 auto;
	width:800px;
	height:310px;
}
.control{
	display:block;
	width:39px;
	height:310px;
	text-indent:-10000px;
	position:absolute;
	cursor:pointer;
}
#leftControl{
	top:0;
	left:0;
	background:transparent url(images/ctrl-left.jpg) no-repeat 0 0;
}
#rightControl{
	top:0;
	right:0;
	background:transparent url(images/ctrl-right.jpg) no-repeat 0 0;
}