解决视频手机端不会自动播放 MediaElementPlayer播放插件参数-智软工作室

智软工作室主要是为宁波公司提供宁波网站建设,宁波网站制作,宁波做网站公司，宁波外贸网站建设公司,宁波网站优化等项目,以优质的服务，优惠的价格，深的客户信赖。相信有你的加入我们的明天会更有动力！期待与你合作！

2014已经悄然到来，在新的一年我们恭贺所有客户事业蒸蒸日上，同事庆祝智软设计工作室成立5周年，在5周年为众多客户提供了保质量的网站设计与网站制作。我们在新的一年质量与服务将会更加进一步为更多的客户带来高端的网站设计与服务！期待与你合作
智软设计工作室多年为宁波企业网站制作建设服务一直以来我们以最优惠价格，最优质的质量，最突出的设计！得到了客户的一致认可,我们的服务包括：宁波网站设计,宁波网站建设,宁波网站制作,宁波网站优化,宁波英文网站制作我们会以优质的服务,最低的价格来报答客户!
点击连接网站优化推广-对企业的网站优化和网站推广--对企业的重要性-点击进行详细了解
2014开幕，宁波智软设计为宁波企业提供更加优秀的设计和实惠的价格
智软设计工作为宁波客户网站设计案例展示平台-案例均为定期更新，让新老客户更好的看到我们做的案例，点击查看我们做的网站案例吧！
智软(宁波网络公司)帮你轻松解决网络问题，网站一站式解决方案

解决视频手机端不会自动播放 MediaElementPlayer播放插件参数

2021-04-06 11:35

最近有个客户需要使用视频背景。电脑倒是好处理。但是手机端不会自动播放。于是找到了这个播放插件

代码获取和使用说明 https://github.com/mediaelement/mediaelement/blob/master/docs/api.md

</video>

</div>

document.addEventListener('DOMContentLoaded', function() {

var mediaElements = document.querySelectorAll('video, audio'), total = mediaElements.length;

for (var i = 0; i < total; i++) {

new MediaElementPlayer(mediaElements[i], {

pluginPath: 'https://cdn.jsdelivr.net/npm/mediaelement@4.2.16/build/',

shimScriptAccess: 'always',

loop: true,

AutoPlay:true,features:[''],clickToPlayPause:false,

success: function () {

var target = document.body.querySelectorAll('.player'), targetTotal = target.length;

for (var j = 0; j < targetTotal; j++) {

target[j].style.visibility = 'visible';

}

});

}

});

</script>

MediaElementPlayer得参数。

Parameter	Type	Default	Description
classPrefix	string	`mejs__`	Class prefix for player elements
poster	string	(empty)	Poster URL that overrides `poster` attribute
showPosterWhenEnded	boolean	`false`	When the video is ended, show the poster
showPosterWhenPaused	boolean	`false`	When the video is paused, show the poster
defaultVideoWidth	number	`480`	Default width if the `<video>` width is not specified
defaultVideoHeight	number	`270`	Default height if the `<video>` height is not specified
videoWidth	number	`-1`	If set, overrides `<video>` width
videoHeight	number	`-1`	If set, overrides `<video>` height
defaultAudioWidth	number	`400`	Default width for audio player if the user doesn't specify
defaultAudioHeight	number	`30`	Default height for audio player if the user doesn't specify
defaultSeekBackwardInterval	function		Default amount to move back when back key is pressed. Default callback is represented like: `function(media) {return (media.duration * 0.05);}`
defaultSeekForwardInterval	function		Default amount to move forward when forward key is pressed. Default callback is represented like: `function(media) {return (media.duration * 0.05);}`
setDimensions	boolean	`true`	Set dimensions via JS instead of CSS
audioWidth	number	`-1`	Width of audio player
audioHeight	number	`-1`	Height of audio player
startVolume	number	`0.8`	Initial volume when the player starts (overrided by user cookie); represented with `float` values
loop	boolean	`false`	Whether to loop or not media
autoRewind	boolean	`true`	Rewind to beginning when media ends
enableAutosize	boolean	`true`	Resize to media dimensions
timeFormat	string	(empty)	Time format to use. Default: `'mm:ss'`. Supported units: `h`: hour, `m`: minute, `s`: second and `f`: frame count. If use 2 letters, 2 digits will be displayed (`hh:mm:ss`)
alwaysShowHours	boolean	`false`	Force the hour marker (`##:00:00`)
showTimecodeFrameCount	boolean	`false`	Whether to show frame count in timecode (`##:00:00:00`)
framesPerSecond	number	`25`	Used when `showTimecodeFrameCount` is set to `true`
autosizeProgress	boolean	`true`	Automatically calculate the width of the progress bar based on the sizes of other elements
alwaysShowControls	boolean	`false`	Hide controls when playing and mouse is not over the video
hideVideoControlsOnLoad	boolean	`false`	Display the video control when media is loading
hideVideoControlsOnPause	boolean	`false`	Display the video controls when media is paused
clickToPlayPause	boolean	`true`	Enable click video element to toggle play/pause
controlsTimeoutDefault	number	`1500`	Time in ms to hide controls
controlsTimeoutMouseEnter	number	`2500`	Time in ms to trigger the timer when mouse moves
controlsTimeoutMouseLeave	number	`1000`	Time in ms to trigger the timer when mouse leaves
iPadUseNativeControls	boolean	`false`	Force iPad's native controls
iPhoneUseNativeControls	boolean	`false`	Force iPhone's native controls
AndroidUseNativeControls	boolean	`false`	Force Android's native controls
features	array	`[...]`	List of features/plugin to use in the player; some will be included in the control bar (by default IN STRICT ORDER: `playpause`, `current`, `progress`, `duration`, `tracks`, `volume`, `fullscreen`)
useDefaultControls	boolean	`false`	If set to `true`, all the default control elements listed in `features` above will be used, and the features will append any other plugins indicated in `features`. This approach is used mostly when adding more plugins WITHOUT modifying the elements in the control bar in any capacity
isVideo	boolean	`true`	Only for dynamic purposes
stretching	string	`auto`	Stretching modes for video player. If `auto` is set, player will try to find the `max-width` and `max-height` CSS styles to turn it into `responsive` mode; otherwise, will set the dimensions specified in the tag (same as setting this option as `none`). The `fill` mode will try to use the available space to make the video fit and, when window is resized, it will crop the dimensions to center it according to the available space.
enableKeyboard	boolean	`true`	Turns keyboard support on and off for this instance
pauseOtherPlayers	boolean	`true`	When focused player starts, it will pause other players
ignorePauseOtherPlayersOption	boolean	`true`	it will ignore pauseOtherPlayers option on currentplayer
secondsDecimalLength	number	`0`	Number of decimal places to show if frames are shown
customError	string/callback	`null`	If error happens, set up customized HTML message through a string or a function. The function has 2 parameters: `media` (the wrapper that mimics all the native events/properties/methods for all renderers) and `node` (the original HTML `video`, `audio` or `iframe` tag where the media was loaded originally)
keyActions	array	`[...]`	Keyboard actions to trigger different actions. Accepts array of objects in format: `{keys: [1,2,3...], action: function(player, media) { ... }}`. To see the entire list, please check `/src/js/mediaelementplayer-player.js`
duration	number	`-1`	Start point to detect changes on media time duration
timeAndDurationSeparator	string	`<span> \| </span>`	Separator between the current time and the total duration of media being played
hideVolumeOnTouchDevices	boolean	`true`	Touch devices (specially mobile devices) have different way to handle volume, so no need to display it
enableProgressTooltip	boolean	`true`	Enable/disable tooltip that shows time popup in progress bar
useSmoothHover	boolean	`true`	Enable smooth behavior when hovering progress bar (like YouTube's)
forceLive	boolean	`false`	If set to `true`, the `Live Broadcast` message will be displayed and progress bar will be hidden, no matter if `duration` is a valid number
audioVolume	string	`horizontal`	Position of volume slider on audio element
videoVolume	string	`vertical`	Position of volume slider on video element
usePluginFullScreen	boolean	`true`	Flag to activate detection of Pointer events when on fullscreen mode
useFakeFullscreen	boolean	`false`	Flag to bypass native capabilities on mobile devices and use the fake-fullscreen mode
tracksAriaLive	boolean	`false`	By default, no WAI-ARIA live region - don't make a screen reader speak captions over an audio track.
hideCaptionsButtonWhenEmpty	boolean	`true`	Option to remove the `[cc]` button when no `<track kind="subtitles">` are present
captionTextPreprocessor	function	not set	Option to preprocess the caption text before it is displayed. If set, it expects a function which takes in caption text and returns a preprocessed version thereof. If it is not set, the caption text is displayed as is.
toggleCaptionsButtonWhenOnlyOne	boolean	`false`	If true and we only have one track, change captions to toggle button
startLanguage	string	(empty)	Automatically turn on a `<track>` element. Note: Will not work when toggleCaptionsButtonWhenOnlyOne is set to `true`
slidesSelector	string	(empty)	Selector for slides; could be any valid JavaScript selector (`#id`, `.class`, `img`, etc.)
tracksText	string	`null`	Title for Closed Captioning button for WARIA purposes
chaptersText	string	`null`	Title for Chapters button for WARIA purposes
muteText	string	`null`	Title for Mute button for WARIA purposes
unmuteText	string	`null`	Title for Unmute button for WARIA purposes
allyVolumeControlText	string	`null`	Title for Volume slider for WARIA purposes
fullscreenText	string	`null`	Title for Fullscreen button for WARIA purposes
playText	string	`null`	Title for Play/Pause button for WARIA purposes when media is playing
pauseText	string	`null`	Title for Play/Pause button for WARIA purposes when media is paused