Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Voices That Matter

  • Print
  • + Share This
From the author of

From the author of

Applying the Action

The next step is to apply the action that inserts the timestamp into the <span> container. Because this action executes when the page loads, you need to set it up as a Head action and execute it by using an OnLoad event.

  1. Click the Toggle Head Section triangle to display the page's head items.

  2. Drag a Head Action from the Smart Objects palette into the Head area.

    Figure 8 Drag a Head action object into the document's Head area.

  3. With the Head action object selected, use the Inspector palette to select the Clock/Date (ID) action from the Action menu. This action is listed as an option in the Others category.

    This displays the Clock/Date (ID) action Inspector.

  4. In the Element ID field, enter the name of the ID style you created earlier: timestamp.

    NOTE

    The Clock/Date (ID) action also has an option to use a Layer (floating box) rather than an ID element. To use layers, you must create named floating boxes in GoLive before applying the action, after which the named layers appear in the layer pull-down menu above the ID field. You can use ID elements or layers, but not both at the same time.

    Even though Netscape 4 supports layers, this action does not display anything in Netscape 4 when using the layer option because there is no support for the innerHTML property within the Netscape 4 DOM.

  5. The rest of the fields determine exactly what information displays in the timestamp. Fill in the following parameters:

    Show local time: checked

    Use 24hr format: unchecked

    Show date: checked

    Date format: month/day/year

    Include day of week: checked

    Lead in text: Today is:

    <open>: leave blank

    </close>: leave blank

    Figure 9 Setting up the action parameters through the Inspector palette.

This completes the action setup. You can now preview your page in one of the supported browsers, and the timestamp, using the CSS style attributes you defined earlier, appears with the local time.

Figure 10 Previewing the timestamp in a web browser.

NOTE

This action's script reads the local time and date on the computer of the person viewing the page, so it displays the local data relevant to whoever is viewing your page. Therefore, if the viewer's computer clock or calendar is not set properly, the incorrect data is displayed.

  • + Share This
  • 🔖 Save To Your Account