参照网上的资料及提供的jQuery插件实现图片幻灯效果。
1、页面前台代码：
//头部引用
<head runat="server"><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></head>
<div id="focusNews" class="ifocus"><asp:Repeater ID="FocusList" runat="server"><ItemTemplate><a title='<%#Eval("Title")%>' target="_blank" href='<%#Eval("Href")%>'><img src='<%#Eval("Src")%>' alt='<%#Eval("Title")%>' /></a></ItemTemplate></asp:Repeater></div>
2、后台代码，主要是实现数据绑定：
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();}下载Demo
新闻热点
疑难解答
