图像幻灯片脚本

问题描述:

我想要以幻灯片形式显示图像。我为每张图片都有一个链接和标题。图像幻灯片脚本

当循环显示图像时,我也希望图像链接和标题相应地改变。

我该怎么办?

+0

请给你的问题标签谷歌,选择众多解决方案之一,然后告诉我们,如果你有与它的具体问题。 – Quasdunk

您可以使用此: http://jquery.malsup.com/cycle/

JavaScript是比PHP为了这个美好的。

您无法使用PHP制作幻灯片。您使用JavaScript来制作幻灯片。

退房此链接:

http://jquery.malsup.com/cycle/

让我给你一个简单的jQuery褪色幻灯片

HTML

<div id="slideshow"> 
    <img src="img/img1.jpg" alt="" class="active" /> 
    <img src="img/img2.jpg" alt="" /> 
    <img src="img/img3.jpg" alt="" /> 
</div> 

CSS

#slideshow { 
    position:relative; 
    height:350px; 
} 

#slideshow IMG { 
    position:absolute; 
    top:0; 
    left:0; 
    z-index:8; 
} 

#slideshow IMG.active { 
    z-index:10; 
} 

#slideshow IMG.last-active { 
    z-index:9; 
} 

部分JQuery

function slideSwitch() { 
    var $active = $('#slideshow IMG.active'); 

    if ($active.length == 0) $active = $('#slideshow IMG:last'); 

    var $next = $active.next().length ? $active.next() 
     : $('#slideshow IMG:first'); 

    $active.addClass('last-active'); 

    $next.css({opacity: 0.0}) 
     .addClass('active') 
     .animate({opacity: 1.0}, 1000, function() { 
      $active.removeClass('active last-active'); 
     }); 
} 

$(function() { 
    setInterval("slideSwitch()", 5000); 
}); 

哦!是的,不要忘记导入jQuery库