utils.js 1.1 KB

12345678910111213141516171819202122232425262728293031323334
  1. function getBlockAxisName(elem) {
  2. var wm = getComputedStyle(elem).writingMode;
  3. return (!wm || wm == 'horizontal-tb') ? 'height' : 'width';
  4. }
  5. function getBSize(elem) {
  6. return elem.getBoundingClientRect()[getBlockAxisName(elem)] + 'px';
  7. }
  8. function setBSize(elem, bsize) {
  9. elem.style[getBlockAxisName(elem)] = bsize;
  10. elem.style.lineHeight = bsize;
  11. }
  12. // Ruby annotations are placed based on block-axis size of inline boxes
  13. // instead of line box. Block-axis size of an inline box is the max
  14. // height of the font, while that of line box is line height. Hence we
  15. // sometimes need to explicitly set the block-axis size of an inline
  16. // box to a block to simulate the exact behavior, which is what the
  17. // following two functions do.
  18. function makeBSizeMatchInlineBox(block, inline) {
  19. setBSize(block, getBSize(inline));
  20. }
  21. function makeBSizeOfParentMatch(elems) {
  22. // The size change is divided into two phases to avoid
  23. // triggering reflow for every element.
  24. for (var elem of elems)
  25. elem.dataset.bsize = getBSize(elem);
  26. for (var elem of elems)
  27. setBSize(elem.parentNode, elem.dataset.bsize);
  28. }