• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Lesson 10. Creating Forms > Adding a clickable image

Adding a clickable image

Next you'll add a clickable image to the form for submitting the application over the Web. This feature is one of the ways you can enable viewers to submit a form. An alternative way is to add a Submit button, which is discussed in “Adding a Reset button” on page 383.

1.
If necessary, scroll down the membership.html window to display the bottom of the form. The main table used to lay out the form has two empty cells in its last row.

2.
Click below the MasterCard image to insert a cursor in the empty table cell on the left.

3.
Drag a Form Input Image icon from the Forms palette to the cursor in the document window. A Form Input Image placeholder is added to the table cell, and the Inspector changes to the Form Input Image Inspector.

4.
If necessary, rearrange your desktop so that the Form Input Image placeholder is visible in the document window and the submit.jpg file is visible in the media folder in the site window. Then click the Form Input Image placeholder in the document window to reselect it.

5.
Drag from the pick whip button () in the Form Input Image Inspector to submit.jpg in the media folder in the site window. The submit application image is added to the table cell.

Connecting Form Input Image placeholder on page to image file in site window

6.
In the Alt Text box, enter Submit Image as an alternative text message for the image.

7.
In the Name / ID area, click he drop down box and choose Name. Enter submitImage into the Name field. This names the clickable image.

8.
Click the More tab of the Form Input Image Inspector. Select the Border option so it's checked and enter a value of 0, if necessary. This prevents a border from marring the appearance of the image.

9.
Choose File > Save to save the page.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint