Adobe Extending Dreamweaver CS4 - Manual (Page 223)

217 EXTENDING DREAMWEAVER CS4
Property inspectors
<!-- Specify the image that will appear in the Property inspector -->
<SPAN ID="image" STYLE="position:absolute; width:23px; height:17px; ¬
z-index:16; left: 3px; top: 2px">
<IMG SRC="marquee.png" WIDTH="36" HEIGHT="36" NAME="marqueeImage">
</SPAN>
<SPAN ID="label" STYLE="position:absolute; width:23px; height:17px; ¬
z-index:16; left: 44px; top: 5px">Marquee</SPAN>
<!-- If your form fields are in different AP elements, you must ¬
create a separate form inside each AP element and reference it as ¬
shown in the inspectSelection() and setInterjectionTag() functions. -->
<SPAN ID="topLayer" STYLE="position:absolute; z-index:1; left: 125px; ¬
top: 3px; width: 431px; height: 32px">
<FORM NAME="topLayerForm">
<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0">
<TR>
<TD VALIGN="baseline" ALIGN="right">Direction:</TD>
<TD VALIGN="baseline" ALIGN="right">
<SELECT NAME="marqDirection" STYLE="width:86"
onChange="setMarqueeTag()">
<OPTION VALUE="left">Left</OPTION>
<OPTION VALUE="right">Right</OPTION>
</SELECT>
</TR>
</TABLE>
</FORM>
</SPAN>
5 Save the file as marquee.htm in the Configuration/Inspectors folder.
Write the JavaScript code
You need to add JavaScript functions to make sure you can inspect the selection, to inspect the selection, and to enter
the appropriate values in the Property inspector.
1 Create a new blank file.
2 To specify that the Property inspector appears whenever the selection contains the marquee tag, add the following
function:
function canInspectSelection(){
return true;
}
3 To refresh the value of the direction attribute that appears in the text field, add the following function at the end
of the file: