マウスオーバーまたはホバー中にこのカウンターを一時停止し、マウスアウト時にカウンターを再開する必要があります。私は多くの方法を試しましたが、jQuery API はまだ初めてです。
<div id="slide_holder">
<div id="slide1" class="hidden">
<img src="images/001.jpg" class="fill">
</div>
<div id="slide2" class="hidden">
<img src="images/002.png" class="fill">
</div>
<div id="slide3" class="hidden">
<img src="images/003.jpg" class="fill">
</div>
<script>
$(function () {
var counter = 0,
divs = $('#slide1, #slide2, #slide3');
function showDiv () {
divs.hide() // hide all divs
.filter(function (index) { return index == counter % 3; }) // figure out correct div to show
.fadeIn('slow'); // and show it
counter++;
}; // function to loop through divs and show correct div
showDiv(); // show first div
setInterval(function () {
showDiv(); // show next div
}, 3 * 1000); // do this every 10 seconds
});
</script>