YouTipAv Prop Muted
## HTML Audio/Video DOM muted Property
The `muted` property sets or returns whether the audio/video output should be silenced (muted).
---
## Definition and Usage
The `muted` property is a boolean property that controls the audio state of a media element. When set to `true`, the audio is silenced; when set to `false`, the audio is played at its current volume level.
This property is highly useful for implementing custom media player controls, handling user preferences, or complying with modern browser autoplay policies (which often require videos to be muted before they can autoplay).
---
## Browser Support
| Feature | Chrome | Edge/IE | Firefox | Safari | Opera |
| :--- | :--- | :--- | :--- | :--- | :--- |
| `muted` Property | Yes (All) | IE 9+ | Yes (All) | Yes (All) | Yes (All) |
*Note: Internet Explorer 8 and earlier versions do not support the `muted` property.*
---
## Syntax
### Set the `muted` property:
```javascript
audio|video.muted = true|false
```
### Return the `muted` property:
```javascript
let isMuted = audio|video.muted;
```
---
## Property Values
| Value | Description |
| :--- | :--- |
| `true` | Specifies that the audio/video output should be muted (silenced). |
| `false` | Default. Specifies that the audio/video output should be unmuted (sound is turned on). |
---
## Technical Details
| Detail | Description |
| :--- | :--- |
| **Return Value** | A Boolean: `true` if the media is muted, `false` otherwise. |
| **Default Value** | `false` |
| **DOM Level** | HTML5 Media Element |
---
## Code Examples
### Example 1: Muting a Video via JavaScript
The following example demonstrates how to programmatically mute a video element using JavaScript.
```html
```
### Example 2: Toggling Mute/Unmute State
This example shows how to create a toggle button that switches the audio state between muted and unmuted, updating the button text dynamically.
```html
```
---
## Important Considerations
### Autoplay Policies
Modern web browsers (such as Google Chrome, Apple Safari, and Mozilla Firefox) enforce strict autoplay policies to improve user experience.
* **The Rule:** Browsers generally block media from autoplaying with sound.
* **The Solution:** To programmatically autoplay a video on page load, you must set the `muted` attribute or property to `true`.
```html
```
### Difference Between `muted` and `volume`
* The `muted` property is a binary state (`true` or `false`) that silences the audio without changing the actual volume level.
* The `volume` property controls the playback loudness (ranging from `0.0` to `1.0`).
* Unmuting a video (`muted = false`) restores the audio to its previous `volume` level.