整个页面如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
注释:
speed:图片轮播速度
num:图片数量
timer:自动轮播的时间间隔,定时器;
flowSpeed:是滑块移动的速速度
blockSlide插件源码如下:
/**
* @author huajianhuakai*/
(function($)
{
$.fn.blockSlide = function(settings)
{
settings = jQuery.extend({
speed: "normal",
num: 4,
timer: 1000,
flowSpeed: 300
}, settings);
return this.each(function()
{
$.fn.blockSlide.scllor($(this), settings);
});
};
$.fn.blockSlide.scllor = function($this, settings)
{
var index = 0;
var imgScllor = $("div:eq(0)>div", $this);
var timerID;
//自动播放
var MyTime = setInterval(function()
{
ShowjQueryFlash(index);
index ;
if (index == settings.num)
index = 0;
}, settings.timer);
var ShowjQueryFlash = function(i)
{
$(imgScllor).eq(i).animate({ opacity: 1 }, settings.speed).css({ "z-index": "100" }).siblings().animate({ opacity: 0 }, settings.speed).css({ "z-index": "0" });
}
}
})(jQuery);