source: www/manuals/HTML_Reference/scripting_reference/styleo.htm@ 1

Last change on this file since 1 was 1, checked in by george, 17 years ago

Prvotní import všeho
File size: 17.5 KB
Line 
1<HTML>
2<!-- This file is part of the HTML Reference Library ('HTMLib') -->
3<!-- It should not be used outside of the HTMLib package -->
4<!-- The HTMLib is © 1995-1998 Stephen Le Hunte -->
5<!-- htmlib@htmlib.demon.co.uk -->
6<HEAD>
7<LINK REL="stylesheet" HREF="../style.css" TYPE="text/css">
8<TITLE>The Style object</TITLE>
9</HEAD>
10<BODY TOPMARGIN="0" BGCOLOR="#FFFFE0" TEXT="#000000">
11
12<CENTER>
13<SPAN CLASS="NSRtitle">The Style Object</SPAN>
14</CENTER>
15
16<P>The Style object is <STRONG>Internet Explorer</STRONG> 4.0 specific and can be used to retrieve any in-line styles applied to an element object by using the <CODE>STYLE</CODE> attribute. Note that it doesn't retrieve stylings set in embedded, or externally linked stylesheets. To obtain information about these, use the <A HREF="csscol.htm" TITLE="View the StyleSheets Collection">StyleSheets collection</A>.
17
18<P><A NAME="props"><STRONG>Properties</STRONG></A><BR>
19The <CODE>Style</CODE> object has a property for <EM>every</EM> possible style setting for element objects. Basically any style sheet attribute is a property of the <CODE>Style</CODE> object. The only difference is grammatical, in terms of hyphenation. Below is a complete list of <CODE>Style</CODE> object properties and their corresponding Style Sheet attributes. For more information about the values of the attributes/properties, see the respective Style Sheets topic.
20
21<P>
22<CENTER>
23<TABLE BORDER="0">
24<TR>
25 <TD NOWRAP><STRONG>Style Object Property</STRONG></TD>
26 <TD><STRONG>Style Sheet attribute</STRONG></TD>
27</TR>
28<TR>
29 <TD>background</TD>
30 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background style sheet properties topic">background</A></TD>
31</TR>
32<TR>
33 <TD>backgroundAttachment</TD>
34 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background-attachment style sheet properties topic">background-attachment</A></TD>
35</TR>
36<TR>
37 <TD>backgroundColor</TD>
38 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background-color style sheet properties topic">background-color</A></TD>
39</TR>
40<TR>
41 <TD>backgroundImage</TD>
42 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background-image style sheet properties topic">background-image</A></TD>
43</TR>
44<TR>
45 <TD>backgroundPostion</TD>
46 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background-position style sheet properties topic">background-position</A></TD>
47</TR>
48<TR>
49 <TD>backgroundRepeat</TD>
50 <TD><A HREF="../Style_Sheets/colprop.htm" TITLE="View the background-repeat style sheet properties topic">background-repeat</A></TD>
51</TR>
52<TR>
53 <TD>border</TD>
54 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border style sheet properties topic">border</A></TD>
55</TR>
56<TR>
57 <TD>borderBottom</TD>
58 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-bottom style sheet properties topic">border-bottom</A></TD>
59</TR>
60<TR>
61 <TD>borderBottomColor</TD>
62 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-bottom-color style sheet properties topic">border-bottom-color</A></TD>
63</TR>
64<TR>
65 <TD>borderBottomStyle</TD>
66 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-bottom-style style sheet properties topic">border-bottom-style</A></TD>
67</TR>
68<TR>
69 <TD>borderBottomWidth</TD>
70 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-bottom-width style sheet properties topic">border-bottom-width</A></TD>
71</TR>
72<TR>
73 <TD>borderColor</TD>
74 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-color style sheet properties topic">border-color</A></TD>
75</TR>
76<TR>
77 <TD>borderLeft</TD>
78 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-left style sheet properties topic">border-left</A></TD>
79</TR>
80<TR>
81 <TD>borderLeftColor</TD>
82 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-left-color style sheet properties topic">border-left-color</A></TD>
83</TR>
84<TR>
85 <TD>borderLeftStyle</TD>
86 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-left-style style sheet properties topic">border-left-style</A></TD>
87</TR>
88<TR>
89 <TD>borderLeftWidth</TD>
90 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-left-width style sheet properties topic">border-left-width</A></TD>
91</TR>
92<TR>
93 <TD>borderRight</TD>
94 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-right style sheet properties topic">border-right</A></TD>
95</TR>
96<TR>
97 <TD>borderRightColor</TD>
98 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-right-color style sheet properties topic">border-right-color</A></TD>
99</TR>
100<TR>
101 <TD>borderRightStyle</TD>
102 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-right-style style sheet properties topic">border-right-style</A></TD>
103</TR>
104<TR>
105 <TD>borderRightWidth</TD>
106 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-right-width style sheet properties topic">border-right-width</A></TD>
107</TR>
108<TR>
109 <TD>borderStyle</TD>
110 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-style style sheet properties topic">border-style</A></TD>
111</TR>
112<TR>
113 <TD>borderTop</TD>
114 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-top style sheet properties topic">border-top</A></TD>
115</TR>
116<TR>
117 <TD>borderTopColor</TD>
118 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-top-color style sheet properties topic">border-top-color</A></TD>
119</TR>
120<TR>
121 <TD>borderTopStyle</TD>
122 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-rop-style style sheet properties topic">border-top-style</A></TD>
123</TR>
124<TR>
125 <TD>borderTopWidth</TD>
126 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-top-width style sheet properties topic">border-top-width</A></TD>
127</TR>
128<TR>
129 <TD>borderWidth</TD>
130 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the border-width style sheet properties topic">border-width</A></TD>
131</TR>
132<TR>
133 <TD>clear</TD>
134 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the clear style sheet properties topic">clear</A></TD>
135</TR>
136<TR>
137 <TD>clip</TD>
138 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the clip style sheet properties topic">clip</A></TD>
139</TR>
140<TR>
141 <TD>color</TD>
142 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the color style sheet properties topic">color</A></TD>
143</TR>
144<TR>
145 <TD>cursor</TD>
146 <TD><A HREF="../Style_Sheets/miscpro.htm" TITLE="View the cursor style sheet properties topic">cursor</A></TD>
147</TR>
148<TR>
149 <TD>display</TD>
150 <TD><A HREF="../Style_Sheets/claspro.htm" TITLE="View the display style sheet properties topic">display</A></TD>
151</TR>
152<TR>
153 <TD>filter</TD>
154 <TD><A HREF="../Style_Sheets/filtpro.htm" TITLE="View the filter style sheet properties topic">filter</A></TD>
155</TR>
156<TR>
157 <TD>font</TD>
158 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font style sheet properties topic">font</A></TD>
159</TR>
160<TR>
161 <TD>fontFamily</TD>
162 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font-family style sheet properties topic">font-family</A></TD>
163</TR>
164<TR>
165 <TD>fontSize</TD>
166 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font-size style sheet properties topic">font-size</A></TD>
167</TR>
168<TR>
169 <TD>fontStyle</TD>
170 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font-style style sheet properties topic">font-style</A></TD>
171</TR>
172<TR>
173 <TD>fontVariant</TD>
174 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font-variant style sheet properties topic">font-variant</A></TD>
175</TR>
176<TR>
177 <TD>fontWeight</TD>
178 <TD><A HREF="../Style_Sheets/fontpro.htm" TITLE="View the font-weight style sheet properties topic">font-weight</A></TD>
179</TR>
180<TR>
181 <TD>height</TD>
182 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the height style sheet properties topic">height</A></TD>
183</TR>
184<TR>
185 <TD>left</TD>
186 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the left style sheet properties topic">left</A></TD>
187</TR>
188<TR>
189 <TD>letterSpacing</TD>
190 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the letter-spacing style sheet properties topic">letter-spacing</A></TD>
191</TR>
192<TR>
193 <TD>lineHeight</TD>
194 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the line-height style sheet properties topic">line-height</A></TD>
195</TR>
196<TR>
197 <TD>listStyle</TD>
198 <TD><A HREF="../Style_Sheets/claspro.htm" TITLE="View the list-style style sheet properties topic">list-style</A></TD>
199</TR>
200<TR>
201 <TD>listStyleImage</TD>
202 <TD><A HREF="../Style_Sheets/claspro.htm" TITLE="View the list-style-image style sheet properties topic">list-style-image</A></TD>
203</TR>
204<TR>
205 <TD>listStylePosition</TD>
206 <TD><A HREF="../Style_Sheets/claspro.htm" TITLE="View the list-style-position style sheet properties topic">list-style-position</A></TD>
207</TR>
208<TR>
209 <TD>listStyleType</TD>
210 <TD><A HREF="../Style_Sheets/claspro.htm" TITLE="View the list-style-type style sheet properties topic">list-style-type</A></TD>
211</TR>
212<TR>
213 <TD>margin</TD>
214 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the margin style sheet properties topic">margin</A></TD>
215</TR>
216<TR>
217 <TD>marginBottom</TD>
218 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the margin-bottom style sheet properties topic">margin-bottom</A></TD>
219</TR>
220<TR>
221 <TD>marginLeft</TD>
222 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the margin-left style sheet properties topic">margin-left</A></TD>
223</TR>
224<TR>
225 <TD>marginRight</TD>
226 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the margin-right style sheet properties topic">margin-right</A></TD>
227</TR>
228<TR>
229 <TD>marginTop</TD>
230 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the margin-top style sheet properties topic">margin-top</A></TD>
231</TR>
232<TR>
233 <TD>overflow</TD>
234 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the overflow style sheet properties topic">overflow</A></TD>
235</TR>
236<TR>
237 <TD>paddingBottom</TD>
238 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the padding-bottom style sheet properties topic">padding-bottom</A></TD>
239</TR>
240<TR>
241 <TD>paddingLeft</TD>
242 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the padding-left style sheet properties topic">padding-left</A></TD>
243</TR>
244<TR>
245 <TD>paddingRight</TD>
246 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the padding-right style sheet properties topic">padding-right</A></TD>
247</TR>
248<TR>
249 <TD>paddingTop</TD>
250 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the padding-top style sheet properties topic">padding-top</A></TD>
251</TR>
252<TR>
253 <TD>pageBreakAfter</TD>
254 <TD><A HREF="../Style_Sheets/prinpro.htm" TITLE="View the page-break-after style sheet properties topic">page-break-after</A></TD>
255</TR>
256<TR>
257 <TD>pageBreakBefore</TD>
258 <TD><A HREF="../Style_Sheets/prinpro.htm" TITLE="View the page-break-before style sheet properties topic">page-break-before</A></TD>
259</TR>
260<TR>
261 <TD>position</TD>
262 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the position style sheet properties topic">position</A></TD>
263</TR>
264<TR>
265 <TD>styleFloat</TD>
266 <TD><A HREF="../Style_Sheets/boxprop.htm" TITLE="View the float style sheet properties topic">float</A></TD>
267</TR>
268<TR>
269 <TD>textAlign</TD>
270 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-align style sheet properties topic">text-align</A></TD>
271</TR>
272<TR>
273 <TD>textDecoration</TD>
274 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
275</TR>
276<TR>
277 <TD>textDecorationBlink</TD>
278 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
279</TR>
280<TR>
281 <TD>textDecorationLineThrough</TD>
282 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
283</TR>
284<TR>
285 <TD>textDecorationNone</TD>
286 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
287</TR>
288<TR>
289 <TD>textDecorationOverline</TD>
290 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
291</TR>
292<TR>
293 <TD>textDecorationUnderline</TD>
294 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-decoration style sheet properties topic">text-decoration</A></TD>
295</TR>
296<TR>
297 <TD>textIndent</TD>
298 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-indent style sheet properties topic">text-indent</A></TD>
299</TR>
300<TR>
301 <TD>textTransform</TD>
302 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the text-transform style sheet properties topic">text-transform</A></TD>
303</TR>
304<TR>
305 <TD>top</TD>
306 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the top style sheet properties topic">top</A></TD>
307</TR>
308<TR>
309 <TD>verticalAlign</TD>
310 <TD><A HREF="../Style_Sheets/textpro.htm" TITLE="View the vertical-align style sheet properties topic">vertical-align</A></TD>
311</TR>
312<TR>
313 <TD>visibility</TD>
314 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the visibility style sheet properties topic">visibility</A></TD>
315</TR>
316<TR>
317 <TD>width</TD>
318 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the width style sheet properties topic">width</A></TD>
319</TR>
320<TR>
321 <TD>zIndex</TD>
322 <TD><A HREF="../Style_Sheets/pospro.htm" TITLE="View the z-index style sheet properties topic">z-index</A></TD>
323</TR>
324</TABLE>
325</CENTER>
326
327<P>The <CODE>Style</CODE> object also supports the following properties:
328
329<P><A NAME="cssText"><STRONG>cssText</STRONG></A><BR>
330The <CODE>cssText</CODE> property returns a string containing the contents of the referenced elements <CODE>STYLE</CODE> attribute.
331<P><STRONG><EM>Note : </EM></STRONG>The contents of the <CODE>cssText</CODE> property returns an alphabetically sorted and expanded list of the style sheet attributes set in the referenced elements <CODE>&lt;STYLE&gt;</CODE> attribute. For example, if an element contains <CODE>STYLE="border-color:red"</CODE>, then the <CODE>cssText</CODE> property of the elements <CODE>style</CODE> object will return:
332
333<SPAN CLASS="egcode">
334<BLOCKQUOTE>
335<CODE>BORDER-BOTTOM-COLOR: red;BORDER-LEFT-COLOR: red;BORDER-RIGHT-COLOR: red;BORDER-TOP-COLOR: red
336</CODE>
337</BLOCKQUOTE>
338</SPAN>
339
340<P>expanding the single shorthand <CODE>border-color</CODE> property into its constituent parts.
341
342<P><A NAME="backgX"><STRONG>backgroundPositionX</STRONG></A><BR>
343The <CODE>backgroundPositionX</CODE> property returns only the x-coordinate of the <CODE>background</CODE> property (see above), which reflects a <CODE>STYLE="background:..."</CODE> settings within the referenced element.
344
345<P><A NAME="backgY"><STRONG>backgroundPositionY</STRONG></A><BR>
346The <CODE>backgroundPositionY</CODE> property returns only the y-coordinate of the <CODE>background</CODE> property (see above), which reflects a <CODE>STYLE="background:..."</CODE> settings within the referenced element.
347
348<P><A NAME="pixelHeight"><STRONG>pixelHeight</STRONG></A><BR>
349The <CODE>pixelHeight</CODE> property returns or sets the height of the referenced element in pixels, regardless of its height unit setting in its stylings.
350
351<P><A NAME="pixelLeft"><STRONG>pixelLeft</STRONG></A><BR>
352The <CODE>pixelLeft</CODE> position sets, or reflects the horizontal offset (relative to the current viewing window) of the left-most edge of the referenced element. The value returned is always in pixels.
353
354<P><A NAME="pixelTop"><STRONG>pixelTop</STRONG></A><BR>
355<CODE>pixelTop</CODE> is much the same as <CODE>pixelLeft</CODE> except that it returns, or sets the vertical offset of the referenced element, in pixels.
356
357<P><A NAME="pixelWidth"><STRONG>pixelWidth</STRONG></A><BR>
358Like <CODE>pixelHeight</CODE>, <CODE>pixelWidth</CODE> returns, or sets the width of the referenced element in pixels, regardless of its length unit settings in the styling.
359
360<P><A NAME="posHeight"><STRONG>posHeight</STRONG></A><BR>
361The <CODE>posHeight</CODE> property sets or retrieves the height of the referenced element in the same units as the elements height is defined in, in the styling. Dynamically setting this property will alter the displayed height of the element, but not alter the height units it uses for display purposes.
362
363<P><A NAME="posLeft"><STRONG>posLeft</STRONG></A><BR>
364The <CODE>posLeft</CODE> property sets or returns the referenced elements left-most position, relative to the current viewing window, in the units specified in the style sheet height attribute. Again, dynamically setting the <CODE>posLeft</CODE> property will move the referenced element, but not affect the length units it uses to position itself.
365
366<P><A NAME="posTop"><STRONG>posTop</STRONG></A><BR>
367<CODE>posTop</CODE> is the same as <CODE>posLeft</CODE>, the only difference being that it deals with vertical offsets, not horizontal ones.
368
369<P><A NAME="posWidth"><STRONG>posWidth</STRONG></A><BR>
370<CODE>posWidth</CODE> returns or sets the width of the current, in the units specified in the stylings width attribute. Again, changing it alters the elements display, but leaves its width units unaffected.
371
372<P><A NAME="methods"><STRONG>Methods</STRONG></A><BR>
373The Style object accepts the <A HREF="../Dynamic_HTML/dhtmlm.htm" TITLE="View the Standard Dynamic HTML Methods topic">standard Dynamic HTML Methods</A> <SPAN CLASS="attr">getAttribute</SPAN>, <SPAN CLASS="attr">removeAttribute</SPAN> and <SPAN CLASS="attr">setAttribute</SPAN>. See that topic for details.
374
375<P>
376<P ALIGN="right" CLASS="copyright">© 1995-1998, Stephen Le Hunte</P>
377</BODY>
378</HTML>
Note: See TracBrowser for help on using the repository browser.