指定した要素を高橋メソッド風表示にする JavaScript

var takahashi = function(id) {
  var c = document.getElementById(id);
  var pw = c.parentNode.offsetWidth;
  with(c.style) {
    fontSize = "10px";
    display = "inline";
  }
  var cw = c.offsetWidth;
  var ph = c.parentNode.offsetHeight;
  var ch = c.offsetHeight;

  var wfs = Math.ceil((pw / cw) * 9);
  if (wfs > 2000) { return }
  with(c.style) {
    fontSize = wfs + "px";
    display = "block";
  }
  var hfs = Math.ceil((ph  / ch) * 8);
  if (hfs > 2000) { return }
  if (hfs < wfs) {
    with(c.style) {
      fontSize = hfs + "px";
    }
  }
}

c は child、p は parent、w は width、h は height、fs は font-size ね。


ma.la さん作「高橋メソッドなプレゼンツール」のまんま! 捻りナシ! ちょっと汎用的にしただけ!