首先非常感谢网友嘉翼的无私分享，此作品是一款简单实用的jquery焦点图特效,是他自己用jquery实现的，代码很简单，很适合网友们学习用，只实现了图片的切换功能、自动播放。。。
使用方法：
1、引入js
2、引入css
3、引入htm
4、你需要添加图片就好了，自动会帮你创建按钮，一个简单的淡入淡出效果焦点图。
5、t = setInterval("showAuto()", 7000);这个7000是毫秒就是7秒的意思，是自动切换的间隔时间
jquery代码如下：
$(function(){
var t = n = count = 0;
$(function(){
count = $("#bannerMain a").size();
for (var i = 1; i < count+1; i++) {
var newsli="<li>"+i+"</li>"
$('#bannerBtn').append(newsli);
};
$("#bannerBtn li").eq(0).addClass('cc');
$("#bannerMain a:not(:first)").hide();
$("#bannerBtn li").click(function() {
$(this).addClass("cc").siblings("li").removeClass("cc");
var i = $(this).text() - 1;
n = i;
if (i >= count) return;
$("#bannerMain a").filter(":visible").fadeOut(500).parent().children().eq(i).fadeIn(1000);
});
t = setInterval("showAuto()", 7000);
$("#banner").hover(function(){clearInterval(t)}, function(){t = setInterval("showAuto()", 7000);});
})
});
function showAuto(){
n = n >= (count - 1) ? 0 : n + 1;
$("#bannerBtn li").eq(n).trigger("click").addClass("cc").siblings("li").removeClass("cc");;
}
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
网友嘉翼 幻灯片 图片滚动 图片轮播 Jquery焦点图 Focusbanner ImgScroll