定義と使用法
transformOriginプロパティを使用すると、変換要素上の位置を変更することができます。
2D転換要素は、要素のx軸とy軸を変更することができます。 3D転換要素は、要素のz軸を変更することができます。
Note:このプロパティは、一緒に使用する必要があります変換プロパティ。
ブラウザのサポート
transformOriginプロパティは、Internet Explorer 10、Firefox、およびOperaでサポートされています。
Internet Explorer 9のではなく、唯一の2D-変換のため、代替、msTransformOriginプロパティをサポートしています。
クロム、サファリ、オペラは2D-と3D-transfomsの両方のために、代替、WebkitTransformOriginプロパティをサポート。
構文
transformOriginプロパティを返します:
object .style.transformOrigin
transformOriginプロパティを設定します。
object .style.transformOrigin=" プロパティ値 値 説明 x-axis ビューは、x軸に配置される定義。 可能な値: - 左
- センター
- 右
- length
- %
y-axis ビューは、y軸に配置される定義。 可能な値: - 上
- センター
- ボトム
- length
- %
z-axis ビューは、z軸に配置される定義(for 3D transforms) 。 可能な値: - length
initial このプロパティがデフォルト値に設定します。 最初の記事を読みます inherit その親要素からこのプロパティを継承します。 継承についての記事を読みます
技術的な詳細
デフォルト値: 50%50%0 戻り値: 要素の変換-originプロパティを表す文字列、 CSSのバージョン CSS3
関連ページ
JavaScriptのスタイルオブジェクト: transform property
CSSリファレンス: transform-origin property
<スタイルオブジェクト