HTA GUI Editor
その結果、DBと繋がる仕事ツールもさくさく作ることができて、ますますHTAが気に入りました。
そのときにはVisual Web Developerを使って画面回りを作ったんですが
というわけで、でっちあげようとしてみました。
んだけども壁にぶつかって先に進まなくなったのでいったん日記にメモ。。。
element.offsetWidthとelement.style.pixelWidthの関係
現象は、テキストボックスを移動すると移動するたびにテキストが太る、というもの。
原因は、移動のたびにoffsetWidthの値をstyle.pixelWidthに代入し直していること。
offsetWidthはHTML要素のBorderとPaddingの値を含めた幅を取得できる、ReadOnlyなプロパティ。
一方で、style.pixelWidthはBorderとPaddingの値を含まない幅を取得・設定できるプロパティ。
んで、たぶん
offsetWidth =style.pixelWidth + ボーダー幅 + パディング幅
っていう関係が成り立つ、と思っている。参考
ここでボーダー幅とパディング幅はそれぞれ
- style.borderLeftWidth (とかborderRightWidthとか)
- style.paddingLeft (とかpaddingRightとか)
で取得できるんだけども、(少なくともHTAでは)このプロパティにはデフォルトスタイルシートの値は入っていない。
そのため、デフォルトでパディングやらボーダーやらが設定されている要素に関しては、offsetWidthとstyle.pixelWidthとの関係を定義できない。
…と、ここまで書いてふと思ったけども、もともとoffsetWidthじゃなくてpixelWidthを使えばいいんじゃないか?
あ、でもそれだとリサイズハンドルの位置がズレちゃうのか。うーん。