mozilla

Compare Revisions

Rich-Text Editing in Mozilla

Change Revisions

Revision 5321:

Revision 5321 by Andreas Wuest on

Revision 5322:

Revision 5322 by Kkuhns on

Title:
Rich-Text Editing in Mozilla
Rich-Text Editing in Mozilla
Slug:
Rich-Text_Editing_in_Mozilla
Rich-Text_Editing_in_Mozilla
Tags:
NeedsTechnicalReview, NeedsMarkupWork, Midas, NeedsEditorialReview, Fixit, richtext
NeedsTechnicalReview, NeedsMarkupWork, Midas, NeedsEditorialReview, Fixit, richtext
Content:

Revision 5321
Revision 5322
n57          String aOptionalCommandArgumentn57          String aValueArgument
58        </dt>
59        <dd>58        </dt>
59        <dd>
60          some commands (such as insertimage) require an extra ar60          some commands (such as insertimage) require an extra va
>gument (the image's url). Pass an argument of <code>null</code> i>lue argument (the image's url). Pass an argument of <code>null</c
>f no argument is needed.>ode> if no argument is needed.
nn70          backColor
71        </dt>
72        <dd>
73          Changes the document background color. Requires a color
 > value string to be passed in as a value argument. (Internet Expl
 >orer uses this to set text background color.)
74        </dd>
75      </dl>
76    </blockquote>
77    <blockquote>
78      <dl>
79        <dt>
n73          toggles the bold attribute of the selected text.n83          Toggles bold on/off for the selection or at the inserti
 >on point. (Internet Explorer uses the STRONG tag instead of B.)
74        </dd>
75      </dl>84        </dd>
76    </blockquote>85      </dl>
77    <blockquote>86    </blockquote>
78      <dl>87    <blockquote>
79        <dt>88      <dl>
80          createlink
81        </dt>89        <dt>
90          contentReadOnly
91        </dt>
92        <dd>
93          Makes the content document either read-only or editable
 >. Requires a boolean true/false to be passed in as a value argume
 >nt. (Not supported by Internet Explorer.)
82        <dd>94        </dd>
83          generates a link from the selected text. Requires the U95      </dl>
>RI to be passed in as the optional argument. 
96    </blockquote>
97    <blockquote>
98      <dl>
99        <dt>
100          copy
101        </dt>
102        <dd>
103          Copies the current selection to the clipboard. Clipboar
 >d capability must be enabled in the user.js preference file. See 
 ><a class="external" href="http://www.mozilla.org/editor/midasdemo
 >/securityprefs.html"></a>
104        </dd>
105      </dl><a class="external" href="http://www.mozilla.org/edito
 >r/midasdemo/securityprefs.html"></a>
106    </blockquote><a class="external" href="http://www.mozilla.org
 >/editor/midasdemo/securityprefs.html"></a>
107    <blockquote>
108      <dl>
109        <dt>
110          createLink
111        </dt>
112        <dd>
113          Creates an anchor link from the selection, only if ther
 >e is a selection. Requires the HREF URI string to be passed in as
 > a value argument. The URI must contain at least a single charact
 >er, which may be a white space. (Internet Explorer creates a link
 > with or without a selection, or a URI value.)
114        </dd>
115      </dl>
116    </blockquote>
117    <blockquote>
118      <a class="external" href="http://www.mozilla.org/editor/mid
 >asdemo/securityprefs.html"></a>
119      <dl>
120        <dd>
121          <a class="external" href="http://www.mozilla.org/editor
 >/midasdemo/securityprefs.html"></a>
122        </dd>
123        <dt>
124          cut
125        </dt>
126        <dd>
127          <a class="external" href="http://www.mozilla.org/editor
 >/midasdemo/securityprefs.html">Cuts the current selection and cop
 >ies it to the clipboard. Clipboard capability must be enabled in 
 >the user.js preference file. See</a> <a class="external" href="ht
 >tp://www.mozilla.org/editor/midasdemo/securityprefs.html"></a>
128        </dd>
129      </dl><a class="external" href="http://www.mozilla.org/edito
 >r/midasdemo/securityprefs.html"></a>
130    </blockquote><a class="external" href="http://www.mozilla.org
 >/editor/midasdemo/securityprefs.html"></a>
131    <blockquote>
132      <dl>
133        <dt>
134          decreaseFontSize
135        </dt>
136        <dd>
137          Adds a SMALL tag around the selection or at the inserti
 >on point. (Not supported by Internet Explorer.)
n93          deletes the current selection.n147          Deletes the current selection.
94        </dd>
95      </dl>148        </dd>
96    </blockquote>149      </dl>
97    <blockquote>150    </blockquote>
98      <dl>
99        <dt>
100          fontname
101        </dt>
102        <dd>
103          changes the fontname of the selected text. Requires the
> name of font ("Arial" for example) to be passed in as the option 
>al argument. 
104        </dd>
105      </dl>
106    </blockquote>151    <blockquote>
152      <dl>
153        <dt>
154          fontName
155        </dt>
156        <dd>
157          Changes the font name for the selection or at the inser
 >tion point. Requires a font name string ("Arial" for example) to 
 >be passed in as a value argument.
158        </dd>
159      </dl>
107    <blockquote>160    </blockquote>
108      <dl>
109        <dt>
110          fontsize
111        </dt>
112        <dd>
113          changes the fontsize of the selected text. Requires the
> size to be passed in as the optional argument. 
114        </dd>
115      </dl>
116    </blockquote>161    <blockquote>
162      <dl>
163        <dt>
164          fontSize
165        </dt>
166        <dd>
167          Changes the font size for the selection or at the inser
 >tion point. Requires an HTML font size (1-7) to be passed in as a
 > value argument.
168        </dd>
169      </dl>
117    <blockquote>170    </blockquote>
118      <dl>171    <blockquote>
119        <dt>172      <dl>
120          fontcolor
121        </dt>173        <dt>
174          foreColor
175        </dt>
176        <dd>
177          Changes a font color for the selection or at the insert
 >ion point. Requires a color value string to be passed in as a val
 >ue argument.
122        <dd>178        </dd>
123          changes the fontcolor of the selected text. Requires th179      </dl>
>e color to be passed in as the optional argument. 
180    </blockquote>
181    <blockquote>
182      <dl>
183        <dt>
184          formatBlock
185        </dt>
186        <dd>
187          Adds an HTML block-style tag around a selection or at t
 >he insertion point line. Requires a tag-name string to be passed 
 >in as a value argument. Virtually all block style tags can be use
 >d (eg. "H1", "EM", "BUTTON", "TEXTAREA"). (Internet Explorer supp
 >orts only heading tags H1 - H6, ADDRESS, and PRE, which must also
 > include the tag delimiters &lt; &gt;, such as "&lt;H1&gt;".)
188        </dd>
189      </dl>
190    </blockquote>
191    <blockquote>
192      <dl>
193        <dt>
194          heading
195        </dt>
196        <dd>
197          Adds a heading tag around a selection or insertion poin
 >t line. Requires the tag-name string to be passed in as a value a
 >rgument (i.e. "H1", "H6"). (Not supported by Internet Explorer.)
198        </dd>
199      </dl>
200    </blockquote>
201    <blockquote>
202      <dl>
203        <dt>
204          hiliteColor
205        </dt>
206        <dd>
207          Changes the background color for the selection or at th
 >e insertion point. Requires a color value string to be passed in 
 >as a value argument. UseCSS must be turned on for this to functio
 >n. (Not supported by Internet Explorer.)
208        </dd>
209      </dl>
210    </blockquote>
211    <blockquote>
212      <dl>
213        <dt>
214          increaseFontSize
215        </dt>
216        <dd>
217          Adds a BIG tag around the selection or at the insertion
 > point. (Not supported by Internet Explorer.)
n133          indents the text block where the caret is located.n227          Indents the selection or insertion point.
134        </dd>
135      </dl>228        </dd>
136    </blockquote>229      </dl>
137    <blockquote>230    </blockquote>
138      <dl>
139        <dt>
140          inserthorizontalrule
141        </dt>
142        <dd>
143          inserts an horizontal rule at the cursor's location.
144        </dd>
145      </dl>
146    </blockquote>231    <blockquote>
232      <dl>
233        <dt>
234          insertHorizontalRule
235        </dt>
236        <dd>
237          Inserts a horizontal rule at the insertion point (delet
 >es selection).
238        </dd>
239      </dl>
147    <blockquote>240    </blockquote>
148      <dl>
149        <dt>
150          insertimage
151        </dt>
152        <dd>
153          inserts an image at the cursor's location. Requires the
> url of the image to be passed in as the optional argument. 
154        </dd>
155      </dl>
156    </blockquote>241    <blockquote>
242      <dl>
243        <dt>
244          insertHTML
245        </dt>
246        <dd>
247          Inserts an HTML string at the insertion point (deletes 
 >selection). Requires a valid HTML string to be passed in as a val
 >ue argument. (Not supported by Internet Explorer.)
248        </dd>
249      </dl>
157    <blockquote>250    </blockquote>
158      <dl>
159        <dt>
160          insertorderedlist
161        </dt>
162        <dd>
163          inserts an ordered list.
164        </dd>
165      </dl>
166    </blockquote>251    <blockquote>
252      <dl>
253        <dt>
254          insertImage
255        </dt>
256        <dd>
257          Inserts an image at the insertion point (deletes select
 >ion). Requires the image SRC URI string to be passed in as a valu
 >e argument.
258        </dd>
259      </dl>
167    <blockquote>260    </blockquote>
168      <dl>261    <blockquote>
169        <dt>262      <dl>
170          insertunorderedlist
171        </dt>263        <dt>
264          insertOrderedList
265        </dt>
266        <dd>
267          Creates a numbered ordered list for the selection or at
 > the insertion point.
172        <dd>268        </dd>
269      </dl>
270    </blockquote>
271    <blockquote>
272      <dl>
273        <dt>
173          inserts an unordered list.274          insertUnorderedList
275        </dt>
276        <dd>
277          Creates a bulleted unordered list for the selection or 
 >at the insertion point.
278        </dd>
279      </dl>
280    </blockquote>
281    <blockquote>
282      <dl>
283        <dt>
284          insertParagraph
285        </dt>
286        <dd>
287          Inserts a paragraph around the selection or the current
 > line. (Internet Explorer inserts a paragraph at the insertion po
 >int and deletes the selection.)
n183          toggles italicize attribute of the selected text.n297          Toggles italics on/off for the selection or at the inse
 >rtion point. (Internet Explorer uses the EM tag instead of I.)
184        </dd>
185      </dl>298        </dd>
186    </blockquote>299      </dl>
187    <blockquote>300    </blockquote>
188      <dl>
189        <dt>
190          justifycenter
191        </dt>
192        <dd>
193          centers the current line.
194        </dd>
195      </dl>
196    </blockquote>301    <blockquote>
302      <dl>
303        <dt>
304          justifyCenter
305        </dt>
306        <dd>
307          Centers the selection or insertion point.
308        </dd>
309      </dl>
197    <blockquote>310    </blockquote>
198      <dl>
199        <dt>
200          justifyleft
201        </dt>
202        <dd>
203          justifies the current line to the left.
204        </dd>
205      </dl>
206    </blockquote>311    <blockquote>
312      <dl>
313        <dt>
314          justifyLeft
315        </dt>
316        <dd>
317          Justifies the selection or insertion point to the left.
318        </dd>
319      </dl>
207    <blockquote>320    </blockquote>
208      <dl>321    <blockquote>
209        <dt>322      <dl>
210          justifyright
211        </dt>323        <dt>
324          justifyRight
212        <dd>325        </dt>
213          justifies the current line to the right.326        <dd>
327          Right-justifies the selection or the insertion point.
n223          outdents the current line if it was indented before.n337          Outdents the selection or insertion point.
224        </dd>
225      </dl>338        </dd>
339      </dl>
340    </blockquote>
226    </blockquote>341    <blockquote>
342      <a class="external" href="http://www.mozilla.org/editor/mid
 >asdemo/securityprefs.html"></a>
343      <dl>
344        <dd>
345          <a class="external" href="http://www.mozilla.org/editor
 >/midasdemo/securityprefs.html"></a>
346        </dd>
347        <dt>
348          paste
349        </dt>
350        <dd>
351          <a class="external" href="http://www.mozilla.org/editor
 >/midasdemo/securityprefs.html">Pastes the clipboard contents at t
 >he insertion point (replaces current selection). Clipboard capabi
 >lity must be enabled in the user.js preference file. See</a> <a c
 >lass="external" href="http://www.mozilla.org/editor/midasdemo/sec
 >urityprefs.html"></a>
352        </dd>
353      </dl><a class="external" href="http://www.mozilla.org/edito
 >r/midasdemo/securityprefs.html"></a>
354    </blockquote><a class="external" href="http://www.mozilla.org
 >/editor/midasdemo/securityprefs.html"></a>
n233          redoes the previously undo command.n361          Redoes the previous undo command.
234        </dd>
235      </dl>362        </dd>
236    </blockquote>363      </dl>
237    <blockquote>364    </blockquote>
238      <dl>365    <blockquote>
239        <dt>366      <dl>
240          removeformat
241        </dt>367        <dt>
368          removeFormat
242        <dd>369        </dt>
370        <dd>
243          removes all formatting from the current selection.371          Removes all formatting from the current selection.
244        </dd>
245      </dl>372        </dd>
246    </blockquote>373      </dl>
247    <blockquote>374    </blockquote>
248      <dl>375    <blockquote>
249        <dt>376      <dl>
250          selectall
251        </dt>377        <dt>
378          selectAll
252        <dd>379        </dt>
380        <dd>
253          selects all of the content of the editable region.381          Selects all of the content of the editable region.
254        </dd>
255      </dl>382        </dd>
256    </blockquote>383      </dl>
257    <blockquote>384    </blockquote>
258      <dl>385    <blockquote>
259        <dt>386      <dl>
260          strikethrough
261        </dt>387        <dt>
388          strikeThrough
262        <dd>389        </dt>
263          toggles strikethrough attribute of the selected text.390        <dd>
391          Toggles strikethrough on/off for the selection or at th
 >e insertion point.
n273          converts the current selection to subscript.n401          Toggles subscript on/off for the selection or at the in
 >sertion point.
n283          converts the current selection to superscript.n411          Toggles superscript on/off for the selection or at the 
 >insertion point.
n293          toggles underlining of the selected text.n421          Toggles underline on/off for the selection or at the in
 >sertion point.
n303          undoes the last executed command.n431          Undoes the last executed command.
n313          removes the link information from the current selectionn441          Removes the anchor tag from a selected anchor link.
>. 
n323          toggles the use of css for the generated markup. Requirn451          Toggles the use of HTML tags or CSS for the generated m
>es a boolean indicating if to turn CSS generation on or off as th>arkup. Requires a boolean true/false as a value argument. NOTE: T
>e optional argument.>his argument is logically backwards (i.e. use false to use CSS, t
 >rue to use HTML). (Not supported by Internet Explorer.)
t347      Another difference between Mozilla and IE is how to access t475      <a class="external" href="http://www.mozilla.org/editor/mid
>the document object of an iframe, which is usually used in conjun>asdemo/securityprefs.html">Another difference between Mozilla and
>ction with designMode. Mozilla uses the W3C standard way, namely > IE is how to access the document object of an iframe, which is u
><code>IFrameElement.<a class="external" href="http://www.w3.org/T>sually used in conjunction with designMode. Mozilla uses the W3C 
>R/DOM-Level-2-HTML/html.html#ID-38538621">contentDocument</a></co>standard way, namely <code>IFrameElement.</code></a><code><a clas
>de>, while IE requires <code>IFrameElement.document</code>.>s="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.htm
 >l#ID-38538621">contentDocument</a></code>, while IE requires <cod
 >e>IFrameElement.document</code>.

Back to History