Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MDN Feature Pages for SVGAnimatedBoolean #37069

Merged
merged 8 commits into from
Dec 11, 2024
Merged
Show file tree
Hide file tree
Changes from 6 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions files/en-us/web/api/svganimatedboolean/animval/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
---
title: "SVGAnimatedBoolean: animVal property"
short-title: animVal
slug: Web/API/SVGAnimatedBoolean/animVal
page-type: web-api-instance-property
browser-compat: api.SVGAnimatedBoolean.animVal
---

{{APIRef("SVG")}}

The **`animVal`** read-only property of the {{domxref("SVGAnimatedBoolean")}} interface represents the current animated value of the associated animateable boolean SVG attribute. If the attribute is not animated, `animVal` is the same as {{domxref("SVGAnimatedBoolean.baseVal")}}.

Some boolean SVG attributes, such as [`preserveAlpha`](/en-US/docs/Web/SVG/Attribute/preserveAlpha), are animateble. In such cases, `SVGAnimatedBoolea.animVal` property is `true` when the attribute value resolves to true. Otherwise, the value is `false`.
yashrajbharti marked this conversation as resolved.
Show resolved Hide resolved

## Value

A boolean; the value of the animatable boolean attribute:

- `true` if the animated value of the attribute is `"true"`.
- `false` if the animated value is `"false"` or not present.

## Specifications

{{Specifications}}

## Browser compatibility

{{Compat}}

## See also

- {{domxref("SVGElement")}}
- {{domxref("SVGAnimationElement")}}
30 changes: 30 additions & 0 deletions files/en-us/web/api/svganimatedboolean/baseval/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
---
title: "SVGAnimatedBoolean: baseVal property"
short-title: baseVal
slug: Web/API/SVGAnimatedBoolean/baseVal
page-type: web-api-instance-property
browser-compat: api.SVGAnimatedBoolean.baseVal
---

{{APIRef("SVG")}}

The **`baseVal`** property of the {{domxref("SVGAnimatedBoolean")}} interface is the value of the associated animateable boolean SVG attribute in its base (none-animated) state. It reflects the value of the associated animateable boolean attribute when no animations are applied.

Some boolean SVG attributes, such as [`preserveAlpha`](/en-US/docs/Web/SVG/Attribute/preserveAlpha), are animateble. In such cases, `SVGAnimatedBoolea.baseVal` property is `false` when the attribute is set to `false`, is omitted and defaults to `false`, or is inheritable and inherits `false`. Otherwise, the value is `true`.
yashrajbharti marked this conversation as resolved.
Show resolved Hide resolved

## Value

A boolean; the base value of the reflected attribute.

## Specifications

{{Specifications}}

## Browser compatibility

{{Compat}}

## See also

- {{domxref("SVGElement")}}
- {{domxref("SVGAnimationElement")}}
6 changes: 3 additions & 3 deletions files/en-us/web/api/svganimatedboolean/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ The `SVGAnimatedBoolean` interface is used for attributes of type boolean which
<th scope="row">Properties</th>
<td>
<ul>
<li>readonly boolean <code>baseVal</code></li>
<li>boolean <code>baseVal</code></li>
<li>readonly boolean <code>animVal</code></li>
</ul>
</td>
Expand Down Expand Up @@ -56,14 +56,14 @@ The `SVGAnimatedBoolean` interface is used for attributes of type boolean which
</thead>
<tbody>
<tr>
<td><code>baseVal</code></td>
<td><code>{{domxref("SVGAnimatedBoolean.baseVal")}}</code></td>
<td>boolean</td>
<td>
The base value of the given attribute before applying any animations.
</td>
</tr>
<tr>
<td><code>animVal</code></td>
<td><code>{{domxref("SVGAnimatedBoolean.animVal")}}</code></td>
<td>boolean</td>
<td>
If the given attribute or property is being animated, contains the
Expand Down
Loading