Skip to content
Related Articles

Related Articles

Improve Article

HTML | DOM Audio loop Property

  • Last Updated : 05 Aug, 2019
Geek Week

The Audio loop property is used for setting or returning whether an audio should start playing over again when it is finished or not.

Syntax:

  • Return the loop property:
    audioObject.loop
  • Set the loop property:
    audioObject.loop = true | false

Property Values

  1. true | false: It is used to specify whether the audio should start playing over again, every time it is finished or not.

Return: The Audio loop property returns a Boolean true if the audio starts playing over again, every time it is finished, else, it returns false.

Below program illustrates the Audio loop Property:
Example 1: Setting the audio to loop.






<!DOCTYPE html>
<html>
  
<head>
    <title>
        Audio loop Property
    </title>
</head>
  
<body style="text-align: center">
  
    <h1 style="color: green">
      GeeksforGeeks
    </h1>
    <h2 style="font-family: Impact">
      Audio loop Property
    </h2>
    <br>
  
    <audio id="Test_Audio" controls>
        <source src="sample1.ogg" 
                type="audio/ogg">
        
        <source src="sample1.mp3" 
                type="audio/mpeg">
    </audio>
  
    <p>To enable loop on the audio being played,
      double click the "Enable Loop" button.</p>
    <br>
  
    <button ondblclick="My_Audio()">
      Enable Loop
    </button>
  
    <p id="test"></p>
  
    <script>
        function My_Audio() {
            var a = document.getElementById("Test_Audio");
            a.loop = true;
            a.load();
            alert(a.loop);
        }
    </script>
  
</body>
  
</html>

Output:

  • Before clicking the button:
  • After clicking the button:

Example 2: Returning the audio to loop.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        Audio loop Property
    </title>
</head>
  
<body style="text-align:center">
  
    <h1 style="color:green">GeeksforGeeks</h1>
    <h2 style="font-family: Impact">Audio loop Property</h2>
    <br>
  
    <audio id="Test_Audio" controls>
        <source src="sample1.ogg" type="audio/ogg">
        <source src="sample1.mp3" type="audio/mpeg">
    </audio>
  
    <p>To Return "Audio loop Property", 
    double click the "Return" button.</p>
    <br>
  
    <button ondblclick="My_Audio()">Return</button>
  
    <p id="test"></p>
  
    <script>
        function My_Audio() {
            var a = document.getElementById("Test_Audio");
            a.loop;
            a.load();
            alert(a.loop);
        }
    </script>
  
</body>
  
</html>

Output:

  • Before clicking the button:
  • After clicking the button:

Supported Browsers: The browser supported by HTML | DOM Audio loop Property are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Apple Safari

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :