| <!DOCTYPE html> |
| <html> |
| <!-- |
| Copyright 2012 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. |
| --> |
| <!-- |
| --> |
| <head> |
| <title> |
| Closure Unit Tests - goog.style.bidi |
| </title> |
| <script src="../base.js"> |
| </script> |
| <script> |
| goog.require('goog.style.bidiTest'); |
| </script> |
| <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> |
| </head> |
| <body> |
| <span id="bodyChild" style="position:fixed;left:60px"> |
| bodyChild |
| </span> |
| <div> |
| <span> |
| LTR |
| </span> |
| <div dir="ltr" onscroll="updateInfo()" id="scrollDivLtr" class="scrollDiv"> |
| <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 name="formLtr" action="bidi_test.html#"> |
| 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 dir="rtl" onscroll="updateInfo();" id="scrollDivRtl" class="scrollDiv"> |
| <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 name="formRtl" action="bidi_test.html#"> |
| 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 /> |
| </body> |
| </html> |