Issues with image slider in Chrome.

Hello. I’m using the easySlider jQuery plug-in([url]http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider[/url]) on this page:

[url]http://tttredesign.ws1.twintierstech.net/slider-test[/url]

I am having serious issues with it in Chrome. It seems to be random at some points but it is positioning the buttons up in the header and the images are not appearing correctly. The image slide is also not moving at the correct coordinates. I have a feeling it’s something with the CSS and not the actual script. If someone could point me in the right direction that would be awesome.

[B]Head:[/B]

[CODE]<script src=”jquery-1.4.4.min.js” type=”text/javascript”></script>

<script type=”text/javascript” src=”easySlider1.7.js”></script>

<script type=”text/javascript”>
$(document).ready(function(){
$(“#slider”).easySlider({
auto: false,
continuous: true
});
});
</script>[/CODE]

[B]Markup:[/B]

[CODE]
<div id=”container”>

<div id=”content”>

<div id=”slider”>
<ul>
<li>
<!–Start of F1–>
<a href=”http://tttredesign.ws1.twintierstech.net/web-funeral-home” target=”_blank”><img src=”images/web.jpg” alt=”Websites” /></a>
<a href=”http://tttredesign.ws1.twintierstech.net/mims” target=”_blank”><img src=”images/mims.jpg” alt=”Mortuary Information Management System”></a>
<a href=”http://tttredesign.ws1.twintierstech.net/cims” target=”_blank”><img src=”images/cims.jpg” alt=”Cremetory Information Managment System” /></a>
</li>

<li> <a href=”http://tttredesign.ws1.twintierstech.net/motv” target=”_blank”><img src=”images/motv.jpg” alt=”Memories On TV” /></a>
<a href=”http://tttredesign.ws1.twintierstech.net/home” target=”_blank”><img src=”images/web-casting.jpg” alt=”Web Casting” /></a>
<a href=”http://tttredesign.ws1.twintierstech.net/home” target=”_blank”><img src=”images/support.jpg” alt=”Support” /></a></li>

</ul>
</div>

</div>

</div>[/CODE]

[B]CSS:[/B]

[CODE]#content{
background-image: url(/image/slider/slider-bg.png);
background-repeat: no-repeat;
height: 242px;
width: 860px;
margin: 0 auto;
}

#container{
width: 860px;
margin: 0 auto;
}
/* Easy Slider */

#slider{
padding: 20px 0px 0px 65px;
}

#slider ul, #slider li,
#slider2 ul, #slider2 li{
margin:0;
padding:0;
list-style:none;
}

#slider2{margin-top:1em;
}
#slider li, #slider2 li{
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
width:815px;
height:200px;
overflow:hidden;
position: relative;
left: 8px;
}
#prevBtn, #nextBtn,
#slider1next, #slider1prev{
display:block;
position: relative;
width:50px;
height:50px;

}
#nextBtn, #slider1next{
left:856px;
top: -50px;
}
#prevBtn a, #nextBtn a,
#slider1next a, #slider1prev a{
display: block;
width:48px;
height:50px;
position: relative;
left: -20px;
top: -120px;
background: url(image/slider/arrow-back.png) no-repeat 0 0;
}
#nextBtn a, #slider1next a{
background: url(image/slider/arrow-forward.png) no-repeat 0 0;
}
/* // Easy Slider */[/CODE]

Also in #JavaScript _↴