DOMRect - 矩形
DOMRectは、矩形を管理するための機能を備えたインターフェイスです。
概要
- 名前
- DOMRect
- 継承
- DOMRectReadOnly
- DOMRect
- IDL
[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0, optional unrestricted double width = 0, optional unrestricted double height = 0), Exposed=(Window,Worker), Serializable, LegacyWindowAlias=SVGRect] interface DOMRect : DOMRectReadOnly { [NewObject] static DOMRect fromRect(optional DOMRectInit other); inherit attribute unrestricted double x; inherit attribute unrestricted double y; inherit attribute unrestricted double width; inherit attribute unrestricted double height; }; dictionary DOMRectInit { unrestricted double x = 0; unrestricted double y = 0; unrestricted double width = 0; unrestricted double height = 0; };
- 仕様書
- https://drafts.fxtf.org/geometry-1/#domrect
チュートリアル
DOMRectは、コンストラクタのDOMRect()で作成できます。
var x = 10 ;
var y = 20 ;
var width = 100 ;
var height = 50 ;
var domRect = new DOMRect( x, y, width, height ) ;
DOMRectはElement.getBoundingClientRect()やRange.getBoundingClientRect()が返します。
var domRect = element.getBoundingClientRect() ;
コンストラクタ
DOMRect()
新しいDOMRectのオブジェクトを作成します。
プロパティ
height
矩形の高さを返します。
width
矩形の横幅を返します。
x
矩形の水平方向の位置を返します。
y
矩形の垂直方向の位置を返します。
メソッド
fromRect()
新しい矩形を作成します。
定数
固有の定数はありません。
イベント
固有のイベントハンドラはありません。
サポート状況
クリックすると、バージョンごとの対応状況を確認できます。
Features | Chrome | Firefox | Safari | Edge | IE | Opera | iOS Safari | Android |
---|---|---|---|---|---|---|---|---|
DOMRect | ● | ● | ● | ● | ● | ● | ● | ● |
DOMRect() | ● 61+ | ● 31+ | ● 10+ | × | × | ● 48+ | ● 10.0+ | × |
fromRect() | ● 61+ | × | ● 10+ | × | × | ● 48+ | ● 10.0+ | × |
height | ● | ● | ● | ● | ● | ● | ● | ● |
width | ● | ● | ● | ● | ● | ● | ● | ● |
x | ● 61+ | ● 31+ | ● 10+ | × | × | ● 48+ | ● 10.0+ | × |
y | ● 61+ | ● 31+ | ● 10+ | × | × | ● 48+ | ● 10.0+ | × |
関連記事
- 要素の位置座標を取得する
- 指定した要素の位置座標を取得します。
- DOMRect.width
- widthは、DOMRectのプロパティです。矩形の横幅を返します。
- Window.scrollTo()
- scrollTo()は、Windowのメソッドです。絶対位置を指定してスクロールします。このメソッドは、scroll()のエイリアスです。
- Window.pageYOffset
- pageYOffsetは、Windowのプロパティです。垂直方向のスクロール量を返します。このプロパティはScrollYのエイリアスです。