SVGFEDropShadowElement: x プロパティ
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年1月以降、すべてのブラウザーで利用可能です。
x は SVGFEDropShadowElement インターフェイスの読み取り専用プロパティで、SVG フィルタープリミティブの位置の水平座標を SVGAnimatedLength で記述します。
これは、入力画像のドロップシャドウを作成する <feDropShadow> 要素の x 属性を反映しています。この属性は、<length> または <percentage> です。<coordinate> は、ユーザー座標系における長さであり、ユーザー座標系の原点から x 軸に沿って指定された距離を表します。x 属性がパーセント値の場合、プロパティの値は、ユーザー座標系単位でのフィルター領域の幅に対する相対値となります。
値
例
js
const feDropShadow = document.querySelector("feDropShadow");
const leftPosition = feDropShadow.x;
console.log(leftPosition.baseVal.value); // `x` の値
仕様書
| 仕様書 |
|---|
| Filter Effects Module Level 1> # dom-svgfilterprimitivestandardattributes-x> |
ブラウザーの互換性
関連情報
SVGFEDropShadowElement.y- CSS の
drop-shadow()関数 - CSS の
box-shadowプロパティ - CSS の
text-shadowプロパティ - CSS の
<blend-mode>データ型 - CSS の
mix-blend-modeプロパティ