JQuery Plugin For Popups and Sound In a Checkbox

Checkbox popup and Sound is a small script from jQuery that enables the checkbox to toggle a notification popup and play a sound when selected. Ideal for I Agree on checkboxes, which inform visitors that your terms or legal agreements have been approved.

if checkbox is checked javascript, play sound javascript, how to display checked checkbox value in javascript, html play sound on button click

How to make use of it:

1. Add your content to the popup box.

<div class="popup-content" style="display: none;">
  ... popup content ...
</div>

2. Add a sound impact to the web page.

<audio class="audiofile">
  <source src="sound/bell.mp3" type="audio/mpeg">
</audio>

3. Apply your personal types to the popup box.

.popup-content {
  width: 400px;
  position: fixed;
  bottom: 50%;
  right: 30px;
  display: block;
  z-index: 999;
}

4. Load the required jQuery library within the doc.

<script src="/path/to/cdn/jquery.min.js"></script>

5. Enable your checkbox input to toggle the popup box.

<input type="checkbox" name="checkbox" id="click-button"> I Agree

(function ($) {
  $('#click-button').change(function () {
    if (this.checked) {
      $('.popup-content').show(function () {
        setTimeout(function () {
          $(".popup-content").fadeOut(2000);
        }, 6000);
      });
      $('.audiofile')[0].play();
    } else {
      $('.popup-content').hide();
    }
  });
})(jQuery)

checkbox checked javascript, javascript play sound on event, Checkbox popup sound Plugin/Github