Git Product home page Git Product logo

hello-muiplayer's Introduction

Play, focus, connection, share and freedom 🚩

Desktop

Mobile

Docs | δΈ­ζ–‡ζ–‡ζ‘£

Introduction

MuiPlayer is an HTML5 video playback plug-in, which is configured with exquisite and operable playback controls by default, involving common playback scenarios, such as full-screen playback, playback fast forward, loop playback, volume adjustment, video decoding and other functions.

Support mp4, m3u8, flv and other media formats to play, solve most compatibility problems, and adapt to play on PCs and mobile phones.

MuiPlayer has a wealth of parameters to customize the player instance, and the video playback of the customized scene can be completed through easy configuration.

Features

MuiPlayer helped us solve some common problems in daily H5 Video application development:

  1. The ui of different browser platforms cannot be unified
  2. Conflicts between ui extensions and state processing are prone to
  3. In different environments (android, ios, pc), h5 video api may trigger events at different times
  4. There are various compatibility issues with media formats, muiplayer handles most of the compatibility issues when playing in different environments
  5. Repeated stepping on some pits in the process of developing h5 video, we provide a complete solution, so that developers can avoid some detours

installation

Install using npm:

npm i mui-player --save

Install using yarn:

yarn add mui-player

usage

1.Use the script tag to introduce:

<!-- import basic style files mui-player.min.css -->
<link rel="stylesheet" type="text/css" href="css/mui-player.min.css"/>

<!-- import basic script mui-player.min.js -->
<script type="text/javascript" src="js/mui-player.min.js"></script>

<!-- Specify the player container -->
<div id="mui-player"></div>

Or use the module manager to import:

import 'mui-player/dist/mui-player.min.css'
import MuiPlayer from 'mui-player'

2.Define the player container:

<div id="mui-player"></div>

3.Initialize and build the player:

// Initialize the MuiPlayer plugin. The MuiPlayer method passes an object that includes the configuration of all plug-ins.
var mp = new MuiPlayer({
    container:'#mui-player',
    title:'Title',
    src:'./static/media/media.mp4',
})

The above can build a video player with default configuration controls for initialization. Below you can read some API basic configuration options about MuiPlayer. Go parameters API

Official document

Start

Install this project

npm install
npm start

Disclaimer

This is a non-commercial version of MuiPlayer. It does not include the same functions as a commercial player, but the open source version can still provide a stable video playback solution. Before using this, be sure to understand the software license of the open source project. If you want to get a commercial application player, please download from the official Professional Application Plugin.

Join group and consulting

QQ:3131244726

©️ Software License

GNU GENERAL PUBLIC LICENSE

Copyright (C) 2007 Free Software Foundation, Everyone is permitted to copy and distribute verbatim copies of this license document, but changing it is not allowed.

⭐ Stars

Stargazers repo roster for @muiplayer/hello-muiplayer

πŸ‘ Forks

Forkers repo roster for @muiplayer/hello-muiplayer

hello-muiplayer's People

Contributors

leisbanon avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.