Please refer this code. Image path should be equal to image placed under your project director
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/gilbitron/Nivo-Slider/master/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#slider').nivoSlider({
pauseTime: 1000,
effect: 'fold', //Specify sets like: 'fold,fade,sliceDown'
slices: 1
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="slider">
<asp:Repeater ID="rptSlider" runat="server">
<ItemTemplate>
<asp:Image ImageUrl='<%# Eval("FilePath") %>' runat="server" />
</ItemTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>
Namespaces
using System.Data.SqlClient;
using System.Data;
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
this.PopulateSlider();
}
}
private void PopulateSlider()
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("SELECT FilePath FROM FileTable ORDER BY NEWID()", con))
{
using (SqlDataAdapter da = new SqlDataAdapter(cmd))
{
DataTable ds = new DataTable();
da.Fill(ds);
rptSlider.DataSource = ds;
rptSlider.DataBind();
}
}
}
}
SQL
CREATE TABLE [dbo].[FileTable](
[ID] [int] IDENTITY(1,1) NOT NULL,
[FileName] [varchar](50) NOT NULL,
[FilePath] [varchar](200) NOT NULL
) ON [PRIMARY]
GO
