我正在尝试使用jQuery模仿主页上的潜在客户的图片幻灯片。我只是想让图像顺利过渡。 image0.jpg ... imagen.jpg。请注意,javascript中的单引号是因为标记包含在标记内。
JAVASCRIPT:
<script type="text/javascript">
function swapImages()
{
var $active = $(\'#myGallery .active\');
var $next = ($(\'#myGallery .active\').next().length > 0) ? $(\'#myGallery .active\').next() : $(\'#myGallery img:first\');
$active.fadeOut(function(){
$active.removeClass(\'active\');
$next.fadeIn().addClass(\'active\');
});
}
$(document).ready(function(){
// Run our swapImages() function every 5secs
setInterval(\'swapImages()\', 5000);
}
</script>
CSS:
<style type="text/css">
.clear
{
clear:left;
}
/* transition effects */
#myGallery
{
position:relative;
width:1000px; /* Set your image width */
height:400px; /* Set your image height */
}
#myGallery img
{
display:none;
position:absolute;
top:0;
left:0;
}
#myGallery img.active
{
display:block;
}
</style>
HTML:
<div id="myGallery">
<img src="'.$baseLink.'/images/slide/0.jpg" alt="Wholesalers" class="active" />
<img src="'.$baseLink.'/images/slide/1.jpg" alt="Premier eShop Software" />
<img src="'.$baseLink.'/images/slide/2.jpg" alt="Team Work" />
</div>