The entire page is as follows:
Copy Code code as follows:
<%@ Page language= "C #" autoeventwireup= "true" codefile= "Test.aspx.cs" inherits= "Test"%>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title></title>
<script src= "Scripts/jquery-1.4.1-vsdoc.js" type= "Text/javascript" ></script>
<script src= "_template/js/blockslide.js" type= "Text/javascript" ></script>
<style type= "Text/css" >
Div#imgadplayer
{
Margin:auto;
margin-bottom:4px;
width:960px;
height:120px;
Background:url (.. /images/photo_01.jpg) left top no-repeat;
padding:0px;
Border:none;
Clear:both;
position:relative;
}
Div#imgadplayer. Smask
{
Position:absolute;
left:0px;
top:0px;
}
</style>
<body>
<!--scrolling pictures start-->
<div id= "Imgadplayer" >
<div id= "Adtop" >
<div id= "Myjquerycontent" >
<div>
<a href= "javascript:void (0)" >
</a></div>
<div class= "Smask" >
<a href= "javascript:void (0)" >
</a></div>
<div class= "Smask" >
<a href= "javascript:void (0)" >
</a>
</div>
<div class= "Smask" >
<a href= "javascript:void (0)" >
</a></div>
</div>
<div id= "Flow" >
</div>
</div>
<script type= "Text/javascript" language= "JavaScript" >
$ (document). Ready (function () {
$ ("#AdTop"). Blockslide ({
Speed: "Normal",
Num:4,
timer:3000,
flowspeed:300
});
});
</script>
</div>
<!--scrolling picture end-->
</body>
Comments:
Speed: Picture Wheel seeding speed
Num: Number of pictures
Timer: Auto-carousel time interval, timer;
Flowspeed: The speed at which the slider moves
Blockslide plug-in source code is as follows:
Copy Code code as follows:
/**
* @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;
Auto Play
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": "M"}). Siblings (). Animate ({opacity:0}, S ettings.speed). css ({"Z-index": "0"});
}
}
}) (JQuery);
I hope it works for a rookie like me.
