blob: 9d22971f194acd3046c80688fb57a81388bca311 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
---
title: element.scrollLeft
slug: Web/API/Element/scrollLeft
tags:
- DOM
- DOM_0
translation_of: Web/API/Element/scrollLeft
---
<p>{{ ApiRef() }}</p>
<h3 id="R.C3.A9sum.C3.A9">Résumé</h3>
<p>Définit ou obtient le nombre de pixels dont le contenu est défilé vers la gauche.</p>
<h3 id="Syntaxe">Syntaxe</h3>
<pre class="eval">// Obtient le nombre de pixels défilés
var <var>sLeft</var> = <var>element</var>.scrollLeft;
</pre>
<p><var>sLeft</var> est un entier représentant le nombre de pixels dont <var>element</var> a été défilé vers la gauche.</p>
<pre class="eval">// Définit le nombre de pixels défilés
<var>element</var>.scrollLeft = 10;
</pre>
<p><strong>scrollLeft</strong> peut être n'importe quelle valeur entière, cependant :</p>
<ul>
<li>Si l'élément ne peut pas défiler (par exemple parce qu'il ne déborde pas), <code>scrollLeft</code> est mis à 0.</li>
<li>S'il reçoit une valeur inférieure à 0, <code>scrollLeft</code> est mis à 0.</li>
<li>S'il reçoit une valeur plus grande que le maximum dont le contenu peut défiler, <code>scrollLeft</code> est mis au maximum.</li>
</ul>
<h3 id="Exemple">Exemple</h3>
<pre><script type="text/javascript">
function doScrollLeft(el, p)
{
el.scrollLeft = p;
}
</script>
<div id="aDiv"
style="width: 100px; height: 200px; overflow: auto;"
>
<script type="text/javascript">
for (var i=0; i<100; ++i){
document.write(i + '-FooBar-FooBar-FooBar<br>');
}
</script>
</div>
<br>
<input type="button" value="Défile de 50 pixels"
onclick="doScrollLeft(document.getElementById('aDiv'), 50);"
>
</pre>
<h3 id="Sp.C3.A9cification">Spécification</h3>
<p>{{ DOM0() }}</p>
<h3 id="R.C3.A9f.C3.A9rences">Références</h3>
<ul>
<li><a href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/scrollleft.asp"><em>scrollLeft</em> sur MSDN</a></li>
</ul>
<p>{{ languages( { "en": "en/DOM/element.scrollLeft", "pl": "pl/DOM/element.scrollLeft" } ) }}</p>
|