<html>
<link rel="stylesheet" href="josh.css">
<body bgcolor="#FFFFFF">

		<div id="Description">
			<table cellpadding="0" cellspacing="0" border="0" width="100%" class="main">
				<tr><td valign="top" class="name">TextRectangle</td><td valign="top" nowrap class="compatibility">NN <span class="emphasis">s.o.</span>  IE <span class="emphasis">5 (Win) </span>DOM <span class="emphasis">s.o.</span></td>
				</tr>
				<tr>
					<td valign="top" nowrap class="usage"><p class="literal"></p>
					</td><td valign="top" nowrap class="requirements"></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="description"><p>Un objet <span class="literal">TextRectangle</span> contient les coordonn&eacute;es des quatre bords d&acute;un cadre invisible qui entoure une cha&icirc;ne de texte de corps. Deux m&eacute;thodes de tous les objets &eacute;l&eacute;ments et l&acute;objet <span class="literal">TextRange</span> produisent des informations au sujet de deux types de rectangles de texte diff&eacute;rents. La m&eacute;thode <span class="literal">getClientRects()</span> renvoie une collection de rectangles de texte ligne par ligne; la m&eacute;thode <span class="literal">getBoundingClientRect()</span> renvoie un seul objet <span class="literal">TextRectangle</span> qui a des coordonn&eacute;es qui englobent tous les rectangles ligne par ligne.
</p>
							</td>
						</tr>
						<tr><td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
						</tr>
						<tr>
							<td colspan="2"><p>L&acute;invocation de l&acute;une de ces m&eacute;thodes permet d&acute;obtenir les valeurs des rectangles imm&eacute;diatement. Le redimensionnement de la fen&ecirc;tre ou la modification du contenu de l&acute;objet cible peuvent modifier les rectangles, mais les objets <span class="literal">TextRangle</span> obtenus pr&eacute;c&eacute;demment ne suivent pas les modifications (puisqu&acute;il est probable que le contenu du rectangle de chaque ligne change). Ainsi, il vaut mieux obtenir les valeurs  <span class="literal">TextRectangle</span> juste avant de les traiter dans d&acute;autres instructions de script.
</p>
							</td>
						</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="objectmodelreference"><span class="title">R&eacute;f&eacute;rence de mod&egrave;le d'objet</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre><span class="replaceable">elementOrTextRangeReference</span>.getBoundingClientRect()
<span class="replaceable">elementOrTextRangeReference</span>.getClientRects()[i]</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="objectspecificproperties"><span class="title">Propri&eacute;t&eacute;s sp&eacute;cifiques &agrave; l&acute;objet</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td>
						<table border="1"><tbody><tr><td><span class="literal">bottom</span></td><td><span class="literal">left</span></td><td><span class="literal">top</span></td><td><span class="literal">right</span></td>
								</tr>
							</tbody></table>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="objectspecificmethods"><span class="title">M&eacute;thodes sp&eacute;cifiques &agrave; l&acute;objet</span></td>
				</tr>
				<tr>
					<td colspan="2"><p>Aucune.</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="objectspecificeventhandlerproperties"><span class="title">Propri&eacute;t&eacute;s de gestionnaire d&acute;&eacute;v&eacute;nements sp&eacute;cifiques &agrave; l&acute;objet</span></td>
				</tr>
				<tr>
					<td colspan="2"><p>Aucune.</p>
					</td>
				</tr>
			</table>
		</div><div id="bottom, left, right, top">
			<table cellpadding="0" cellspacing="0" border="0" width="100%" class="main">
				<tr><td valign="top" class="name">bottom, left, right, top</td><td valign="top" nowrap class="compatibility">NN <span class="emphasis">s.o.</span>  IE <span class="emphasis">5 (Win) </span>DOM <span class="emphasis">s.o.</span></td>
				</tr>
				<tr>
					<td valign="top" nowrap class="usage"><p class="literal"></p>
					</td><td valign="top" nowrap class="requirements">Lecture seule</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="description"><p>Renvoient des valeurs en pixels, sous forme de nombres entiers, pour les coordonn&eacute;e des bords du rectangle de la fen&ecirc;tre du navigateur. Remarque: Ces valeurs ne sont pas fonction de la page. D&egrave;s lors, ces valeurs changent lorsque le conteneur du texte d&eacute;file.
</p>
							</td>
						</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="example"><span class="title">Exemple</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>var rightMostEdge = document.getElementById("myP").getBoundingClientRect().right;</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="value"><span class="title">Valeur</span></td>
				</tr>
				<tr>
					<td colspan="2"><p>Mesures en pixels (nombre entier).</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&#160;</td>
				</tr>
				<tr>
					<td valign="top" nowrap colspan="2" class="default"><span class="title">Par d&eacute;faut</span></td>
				</tr>
				<tr>
					<td colspan="2"><p>Aucune.</p>
					</td>
				</tr>
			</table>
		</div>

</body>
</html>