1.0.0 • Published 3 years ago
muzus v1.0.0
New conception of audio player for web.
Setup
<!-- include muzus: js and css -->
<link href="dist/muzus.min.css" rel="stylesheet"/>
<script src="dist/muzus.min.js"></script>
Available in NPM
npm install muzus
Basic Usage
Each link with href
attribute and parent element class muzus
automatically becomes a player for the linked MP3.
Single track
<section class="muzus">
<a href="https://....mp3">Track name</a>
</section>
Playlists
<section class="muzus">
<a href="https://....mp3">Track name 1</a>
<a href="https://....mp3">Track name 2</a>
<a href="https://....mp3">Track name 3</a>
</section>
Check muzus/example/index.html to see more examples of usage.
Advanced Features
data-attributes
Adding some data-attributes changes the behavior or appearance of the player.
Attribute_Name | Type | Default value | Description |
---|---|---|---|
data-repeat | boolean | false | Applied to a element with class muzus . Defines whether to repeat the playback after the last track is finished. |
Preload options of script
Adding in <head>
your page, if you need setup player before initialize. Define in global object Muzus
. [Example]
Option | Type | Default Value | Description |
---|---|---|---|
autoInit | boolean | true | Defines automatically initialize player after page loaded. |
isMobile | function | + | Defines custom function for check is mobile device use. |
Development
Gulp
Install gulp-cli
:
npm install --global gulp-cli
Restore development dependencies:
npm i --only=dev
SCSS
Compiling:
gulp build:sass
Auto-compiling:
gulp sass:watch
Run example
npm run dev
License
© 2017 Yauheni Pakala | MIT License
1.0.0
3 years ago