Creating a Slideshow Image Gallery using ASP.Net Repeater and jQuery Carousel Plugin
Hi
I have a Repeater control where I am showing Images and some text from database on my site.
I want to change it and make a sliding Repeater where user can just slide it.
There will be a button for previous and next so that user can see records.
I have use the following code and css but it does not work for me.
Anybody can help ?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/jcarousel/0.2.8/jquery.jcarousel.min.js"></script>
<link href="http://cdn.jsdelivr.net/jcarousel/0.2.8/skins/tango/skin.css" rel="Stylesheet" />
Kindly help me out.
Design Of The Page :
<%@ Page Language="C#"
AutoEventWireup="true"
CodeFile="Default2.aspx.cs"
Inherits="Default2" Title="Slide Check" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Slide Check</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/jcarousel/0.2.8/jquery.jcarousel.min.js"></script>
<link href="http://cdn.jsdelivr.net/jcarousel/0.2.8/skins/tango/skin.css" rel="Stylesheet" />
<script type="text/javascript">
$(function()
{
$('#mycarousel').jcarousel();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<ul id="mycarousel" class="jcarousel-skin-tango">
<asp:Repeater ID="rptImages" runat="server">
<ItemTemplate>
<li>
<asp:Image ID="Image985" runat="server" ImageUrl='<%# Eval("Image1") %>' Height="75px" Width="75px" />
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</form>
</body>
</html>
Code OF The Page :
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
try
{
String Query1;
int Count1;
DataSet DataSet1 = new DataSet();
Query1 = "Select * From Item";
DataSet1 = OnlinePizzaOrder.Connection.Select_Query(Query1);
Count1 = DataSet1.Tables[0].Rows.Count;
DataTable Datatable1 = new DataTable();
Datatable1 = DataSet1.Tables[0];
rptImages.DataSource = Datatable1;
rptImages.DataBind();
}
catch (Exception ex)
{
ex.Message.ToString();
}
finally
{
}
}
}
