Support us .Net Basics C# SQL ASP.NET ADO.NET MVC Slides C# Programs Subscribe Buy DVD

Provide capability to start and stop image slideshow - Part 136

Suggested Videos
Part 133 - What is AutoEventWireup in
Part 134 - Add image slideshow to your website using ajax and c#
Part 135 - Display images in sequence in an image slideshow

Please watch Parts 134 & 135 before proceeding. We will be continuing with the example, that we started in Part 135. At the moment, there is no mechanism in place to start or stop the slideshow.

What we want to achieve in this video?
start and stop image slideshow

1. Provide a button control as shown in the image
2. If the Sildeshow has not already started, the text on the button will be "Start Slideshow"
3. Once the button is clicked, the "slideshow" starts, and then, the text on the button will be changed to "Stop Slideshow". The images should be displayed in sequence from 1 to 8. The images should be changed dynamically in sequence until "Stop Slideshow" button is clicked.
4. Once "Stop SlideShow" button is clicked, the slideshow should stop. If the user clicks "start slideshow", then the slide show sould resume from where it was left.

To achieve this
1. Drag and drop a button control on the webform.
2. Set Text= "Stop Slideshow".
3. Generate click event handler from Button1. Copy and paste the following code.
protected void Button1_Click(object sender, EventArgs e)
    // If timer is enabled, disable timer and change 
    // the text on the button control accordingly
    if (Timer1.Enabled)
        Timer1.Enabled = false;
        Button1.Text = "Start Slideshow";
    // If timer is disabled, enable timer and change 
    // the text on the button control accordingly
        Timer1.Enabled = true;
        Button1.Text = "Stop Slideshow";

At the moment, there are 2 problems with this code. If we want to add a new image to the slide show, 
1. We will have to modify the application code
2. The new image has to be named in a specific way. Since we already have 8 images, the next image has to be named 9.jpg.

No comments:

Post a Comment

If you like this website, please share with your friends on facebook and Google+ and recommend us on google using the g+1 button on the top right hand corner.