Asp. NET using jquery plug-ins to achieve the picture slideshow effect

The image slideshow effect is achieved by referring to the information on the web and the jquery plugin provided.

1, the page foreground code:

Header reference

<title></title>
<script type= "Text/javascript" src= "Scripts/jquery/jquery-1.10.2.min.js" ></script>
<script type= "Text/javascript" src= "scripts/jquery/jquery. Kinslideshow-1.2.1.min.js "></script>
<script type= "Text/javascript" >
$ (function () {
$ ("#focusNews"). Kinslideshow ();
})
</script>

<div id= "Focusnews" class= "Ifocus" >
<asp:repeater id= "focuslist" runat= "Server" >
<ItemTemplate>
<a title= ' <% #Eval ("title")%> ' target= ' _blank ' href= ' <% #Eval ("href")%> ' >
' alt= ' <% #Eval ("Title")%> '/></a>
</ItemTemplate>
</asp:Repeater>
</div>

2, backstage code, mainly to achieve data binding:

protected void Page_Load (object sender, EventArgs e)
{
if (! IsPostBack)
{
Bindslider ();
}
}

private void Bindslider ()
{
List<myitem> List = new list<myitem> ();
MyItem Item1 = New myitem ();
Item1. Title = "Item1";
Item1. SRC = "Images/1.jpg";
Item1. Href = "http://www.szit.edu.cn";
MyItem item2 = new myitem ();
Item2. Title = "ITEM2";
Item2. SRC = "Images/2.jpg";
Item2. Href = "http://www.sohu.com";
MyItem Item3 = new myitem ();
Item3. Title = "Item3";
Item3. SRC = "Images/3.jpg";
Item3. Href = "http://www.sina.com";
List. ADD (ITEM1);
List. ADD (ITEM2);
List. ADD (ITEM3);
Focuslist.datasource = list;
Focuslist.databind ();
}
Download demo