[jQuery] Problem with the Cycle Plugin

[AntoLeNice]

Hey there,

I just installed a Cycle plugin on the website I'm working on, and I have a problem.

 

On Firefox, everything works just fine, but when I open the website on Google Chrome, sometimes the images won't appear. I have 3 sliders: leftSlide, rightSlide and mainSlide, but only the latter will disappear. When I look at the source with Firebug, the source shows the <div> where my images are, but it's written with a lower opacity (I don't know what that means).

 

The problem also occurs in IE (8.0) from time to time. You might like to look at the problem directly : http://antoine.cameleonmedia.com/gite . This page will be removed as soon as the problem will be fixed.

 

So I ask you, 

 

Thanks a lot if you can help, Antoine.

[AntoLeNice]

If it could help getting an answer

 

Code in the head of the HTML file:

 

<script type="text/javascript">
<!--
if (document.images)
{
pic1= new Image(940,324); 
pic1.src="images/slideshow/main/pancarte.jpg"; 

pic2= new Image(940,324); 
pic2.src="images/slideshow/main/fleurs.jpg"; 

pic3= new Image(940,324);
pic3.src="images/slideshow/main/front.jpg"; 
}
//-->
</script>

<link type="text/css" href="css/slideshow.css" rel="stylesheet" /> <!-- Stylesheet slideshow --> 
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <!-- Script jQuery --> 
<script type="text/javascript" src="js/jquery-ui-1.8.4.custom.min.js"></script> <!-- Script jQUery UI --> 
<script type="text/javascript" src="js/siteImages.js"></script> <!-- Script images --> 
<script type="text/javascript" src="js/jquery.cycle.js"></script> <!-- Script cycle -->

 

Code in the body:

<div id="mainSlide">
<div class="slide">
	<img alt="Des fleurs !" src="images/slideshow/main/fleurs.jpg" />
</div>
<div class="slide">
	<img alt="Un devant !" src="images/slideshow/main/front.jpg" />
</div>
<div class="slide">
	<img alt="Une pancarte !" src="images/slideshow/main/pancarte.jpg" />
</div>
</div>

<div id="nextButton">
<a href="#" id="nextSlide"> </a>
</div>

 

jQuery:

$(function(){
$('#leftSlide, #mainSlide, #rightSlide').cycle({
	fx:     'scrollHorz', 
	speed:   1000, 
	timeout: 10000, 
	next:   '#nextSlide'
});
});