Get unlimited public & private packages + team-based management with npm Teams.Learn more »

audio-tool

1.0.5 • Public • Published

audio-tool

A native audio custom web component

code style: prettier npm version Build Status Published on webcomponents.org

Description

An audio custom web component built with the native customElements.define function and on top of the HTML Audio element. No javascript library or framework attached.

Live Demo

Check out a live demo here.

Install

npm install audio-tool

How to use

  1. Inject in the script through a script tag in the HEAD of your index.html.
<script src="node_modules/audio-tool/dist/audio-tool.min.js"></script>
  1. Start using it in an html file.
<audio-tool src="content/ff7-prelude.m4a" title="FF7 Prelude"></audio-tool>

PolyFill

Using a browser that doesn't natively support custom web components?

Add the following to the HEAD of your index.html.

<script src="https://unpkg.com/@webcomponents/custom-elements"></script>

or go here to learn more...

Responsiveness

Add the following meta tag for responsiveness across all devices.

This tag is not specific to this component. This is required for any app to understand the screen size in mobile browsers.

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes" />

Customizations

Attribute type Description Default
src string the path to your audio file none
title string Define the track title. The path to your audio file
auto-play boolean Automatically start playing the track onload false
styles boolean Defines whether the element uses the default styles or not. true
preload string: auto, metadata, none Defines if the audio file should be loaded when the page loads auto

Note: The preload attribute is ignored if autoplay is present.

Browser Compatibility

Mozilla Browser Compatibility Table for customElements.define

Specs

Contribute

Contribution Guidelines

License

MIT License

Install

npm i audio-tool

DownloadsWeekly Downloads

1

Version

1.0.5

License

MIT

Unpacked Size

43.7 kB

Total Files

13

Last publish

Collaborators

  • avatar