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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
|
<!--
Copyright 2017 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<style>
/* Using borders, padding, and margins of various prime values. */
.scrollDiv {
left:50px; width:250px; height: 100px;
position:absolute; overflow:auto; border-left: 3px solid green;
border-right: 17px solid green; margin: 7px; padding: 13px;
}
</style>
<span id="bodyChild" style="position:fixed;left:60px">
bodyChild
</span>
<div>
<span>
LTR
</span>
<div class="scrollDiv" dir="ltr" id="scrollDivLtr" onscroll="updateInfo()">
<div style="width: 1000px; height: 2000px;background-color: blue">
</div>
<div id="scrolledElementLtr" style="background:yellow; top: 25px; left:85px;
width: 100px; position:absolute">
elm
</div>
</div>
<div style="left:400px; position:absolute;">
<div>
elm.offsetParent.scrollLeft:
<span id="elementScrollLeftLtr">
</span>
</div>
<div>
bidi.getScrollLeft(...):
<span id="bidiScrollLeftLtr">
</span>
</div>
<div>
bidi.getOffsetStart(...):
<span id="bidiOffsetStartLtr">
</span>
</div>
<form action="bidi_test.html#" name="formLtr">
goog.style.bidi.setScrollOffset:
<input name="pixelsLtr" type="text"/>
<a href="bidi_test.html#" onclick="goog.style.bidi.setScrollOffset(
document.getElementById('scrollDivLtr'),
parseInt(formLtr.elements['pixelsLtr'].value));">
set
</a>
</form>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</div>
<hr/>
<div>
<span>
RTL
</span>
<div class="scrollDiv" dir="rtl" id="scrollDivRtl" onscroll="updateInfo();">
<div style="width:1000px; height:70px;background-color:blue">
</div>
<div id="scrolledElementRtl" style="background:yellow; top: 25px; right:85px;
width: 100px; position:absolute">
elm
</div>
</div>
<div style="left:400px; position:absolute;">
<div>
elm.offsetParent.scrollLeft:
<span id="elementScrollLeftRtl">
</span>
</div>
<div>
bidi.getScrollLeft(...):
<span id="bidiScrollLeftRtl">
</span>
</div>
<div>
bidi.getOffsetStart(...):
<span id="bidiOffsetStartRtl">
</span>
</div>
<form action="bidi_test.html#" name="formRtl">
goog.style.setScrollOffset:
<input name="pixelsRtl" type="text"/>
<a href="bidi_test.html#" onclick="goog.style.bidi.setScrollOffset(
document.getElementById('scrollDivRtl'),
parseInt(formRtl.elements['pixelsRtl'].value));">
set
</a>
</form>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</div>
<div dir="rtl" id="scrollLeftRtl" style="position: relative; width: 100px; height: 100px;
background-color: blue">
<div style="position:absolute; width: 200px; height: 20px; background-color:
green">
INNER
</div>
</div>
<hr/>
<br/>
<br/>
|
