by
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年1月以降、すべてのブラウザーで利用可能です。
by 属性は、アニメーション中に変化する属性の相対的なオフセット値を指定します。
この属性の初期値は、attributeName または from 属性の値として指定することで示されます。
この属性は、以下の SVG 要素で使用することができます。
例
html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<rect x="10" y="10" width="100" height="100">
<animate attributeName="width" fill="freeze" by="50" dur="3s" />
</rect>
</svg>
使用上のメモ
| 値 | 下記参照 |
|---|---|
| デフォルト値 | なし |
| アニメーション | 不可 |
この属性の具体的なデータ型は、アニメーションの対象となる属性の値によって異なります。
values 属性を使用して値のリストが定義されている場合、by 属性は無視されます。
仕様書
| 仕様書 |
|---|
| SVG Animations Level 2 # ByAttribute |