SVGFEDropShadowElement: dy-Eigenschaft
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Januar 2020 browserübergreifend verfügbar.
Die dy schreibgeschützte Eigenschaft der Schnittstelle SVGFEDropShadowElement spiegelt das dy Attribut des gegebenen <feDropShadow> Elements wider.
Wert
Ein SVGAnimatedNumber Objekt.
Beispiele
Zugriff auf den dy-Wert
In diesem Beispiel rufen wir die vertikale Verschiebung des <feDropShadow>-Elements ab, indem wir die schreibgeschützte Eigenschaft dy der SVGFEDropShadowElement Schnittstelle verwenden.
html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="drop-shadow-filter">
<!-- Drop Shadow with dy property set to 10 -->
<feDropShadow
in="SourceGraphic"
dx="10"
dy="10"
stdDeviation="5"
flood-color="red" />
</filter>
</defs>
<!-- Rectangle with a red shadow -->
<rect
x="20"
y="20"
width="100"
height="100"
fill="red"
filter="url(#drop-shadow-filter)" />
<!-- Circle with a red shadow -->
<circle
cx="100"
cy="100"
r="50"
fill="blue"
filter="url(#drop-shadow-filter)" />
</svg>
js
const dropShadow = document.querySelector("feDropShadow");
console.log(dropShadow.dy.baseVal); // Output: 10
Spezifikationen
| Spezifikation |
|---|
| Filter Effects Module Level 1 # dom-svgfedropshadowelement-dy |