Adding Custom Images to the Increment and Decrement Buttons

In this topic, you will learn how to add custom images to the increment and decrement buttons. To complete this topic, you will need two custom images to add to the project. You can use the following images by right-clicking the image to opening its context menu and then selecting Save Image As. This topic assumes that you have created an AJAX-enabled ASP.NET project that contains a ScriptManager control (see Creating an AJAX-Enabled ASP.NET Project) and a C1Slider control.

Complete the following steps:

1.   In Solution Explorer, right-click your project to open its context menu and select New Folder. Name the new folder "Images".

2.   Right-click the Images folder to open its context menu and select Add Existing Item. 

      The Add Existing Item dialog box appears.

3.   In the Add Existing Item dialog box, navigate to the location of your custom images, select them, and then press Add. 

      The Add Existing Item dialog box closes and your custom images appear within the Images folder.

4.   Right-click the C1Slider control to open its context menu and then select Properties from the list.

      The Properties window opens with C1Slider's properties in focus.

5.   Expand the DecrementButton node to reveal its list of properties and complete the following:

a.   Locate the ImageUrl property and click its ellipsis button .

The Select Image dialog box opens.

b.   Select the Images folder to reveal its list of contents.

c.    Select the decrement button image and then press OK.

The ImageUrl property is now set with your custom image.

6.   Expand the IncrementButton node to reveal its list of properties and complete the following:           

a.   Locate the ImageUrl property and click its ellipsis button .

The Select Image dialog box opens.

b.   Select the Images folder to reveal its list of contents.

c.    Select the increment button image and then press OK.

d.   TheImageUrl property is now set with your custom image.

7.   Save the project and open it in a Studio for iPhone-compatible browser.

 This Topic Illustrates the Following:

The following image depicts a C1Slider control with custom decrement and increment buttons.