chao
/
mini_cocopi


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
							<!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>
  <meta charset="UTF-8" />
  <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>