How to make slideshow using ASP.NET Repeater
I am dynamically loading my image urls from the database.
Here is my current code for a repeater for loading images
<asp:Repeater ID="Repeater1" runat="server" Visible="True">
<ItemTemplate>
<a><asp:Image ID="Image1" runat="server" Width="1200" Height="300" ImageURL='<%#Eval("ThumbnailPath")%>' class="slide" /></a>
</ItemTemplate>
</asp:Repeater>
This is my .ASPX page where the image comes out but it only displays my images vertically, how do I do this in a slideshow?
Here is my code Uploading Images to Relay
GallerySTR = ConfigurationManager.ConnectionStrings["PPDB"].ConnectionString;
GalleryCN = new SqlConnection(GallerySTR);
string LoginQuery = "SELECT * FROM Albums";
GalleryCN.Open();
GalleryCMD = new SqlCommand(LoginQuery, GalleryCN);
GalleryDA = new SqlDataAdapter(GalleryCMD);
GalleryDS = new DataSet();
GalleryDA.Fill(GalleryDS);
Repeater1.DataSource = GalleryDS;
Repeater1.DataBind();
I can upload pictures fine, but I cannot seem like you are doing this in a slideshow. maybe there is javascript? or any method or codes?
+3
source to share
1 answer
Go to this
This will look like in your aspx designer
<div class="slideshow" data-transition="crossfade" data-loop="true" data-skip="false">
<ul class="carousel">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<li class="slide">
<img src='<%# DataBinder.Eval (Container.DataItem, "ImageUrl") %>' alt="" width="440" height="200" />
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
Link your code to this relay and don't forget to include the script in the aspx page.
UPDATE
Add a link to the required css file in the header section of the html page. You will need to adapt to your project.
<link href="Content/Slideshow.css" rel="stylesheet">
And at the end of the body tag, you will add js scripts
<script type="text/javascript" src="Scripts/Slideshow.js"></script>
+1
source to share