SYNCERのロゴ
アイキャッチ画像

DOMRect - 矩形

DOMRectは、矩形を管理するための機能を備えたインターフェイスです。

概要

名前
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()

新しい矩形を作成します。

定数

固有の定数はありません。

イベント

固有のイベントハンドラはありません。

サポート状況

クリックすると、バージョンごとの対応状況を確認できます。

FeaturesChromeFirefoxSafariEdgeIEOperaiOS SafariAndroid
DOMRect 9+
DOMRect() 61+ 31+ 10+×× 48+ 10.0+×
fromRect() 61+× 10+×× 48+ 10.0+×
height 9+
width 9+
x 61+ 31+ 10+×× 48+ 10.0+×
y 61+ 31+ 10+×× 48+ 10.0+×
  • Twitterでシェア
  • Facebookでシェア
  • Google+でシェア
  • はてなブックマークでシェア
  • pocketに保存
  • LINEでシェア
更新履歴
2017年10月15日 (日)
コンテンツを公開しました。