Files
ArtPlayer/docs/document/assets/js/fb30adf9.a35daf84.js
T
2022-04-26 17:23:42 +08:00

1 line
68 KiB
JavaScript

"use strict";(self.webpackChunkartplayer_document=self.webpackChunkartplayer_document||[]).push([[303],{3905:function(e,t,n){n.d(t,{Zo:function(){return o},kt:function(){return s}});var a=n(7294);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function i(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){l(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function p(e,t){if(null==e)return{};var n,a,l=function(e,t){if(null==e)return{};var n,a,l={},r=Object.keys(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||(l[n]=e[n]);return l}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n])}return l}var d=a.createContext({}),m=function(e){var t=a.useContext(d),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},o=function(e){var t=m(e.components);return a.createElement(d.Provider,{value:t},e.children)},u={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},k=a.forwardRef((function(e,t){var n=e.components,l=e.mdxType,r=e.originalType,d=e.parentName,o=p(e,["components","mdxType","originalType","parentName"]),k=m(n),s=l,N=k["".concat(d,".").concat(s)]||k[s]||u[s]||r;return n?a.createElement(N,i(i({ref:t},o),{},{components:n})):a.createElement(N,i({ref:t},o))}));function s(e,t){var n=arguments,l=t&&t.mdxType;if("string"==typeof e||l){var r=n.length,i=new Array(r);i[0]=k;var p={};for(var d in t)hasOwnProperty.call(t,d)&&(p[d]=t[d]);p.originalType=e,p.mdxType="string"==typeof e?e:l,i[1]=p;for(var m=2;m<r;m++)i[m]=n[m];return a.createElement.apply(null,i)}return a.createElement.apply(null,n)}k.displayName="MDXCreateElement"},3117:function(e,t,n){n.r(t),n.d(t,{frontMatter:function(){return p},contentTitle:function(){return d},metadata:function(){return m},toc:function(){return o},default:function(){return k}});var a=n(7462),l=n(3366),r=(n(7294),n(3905)),i=["components"],p={title:"\u57fa\u7840\u53c2\u6570",sidebar_position:2,slug:"/zh-cn/options"},d=void 0,m={unversionedId:"zh-cn/Options",id:"zh-cn/Options",isDocsHomePage:!1,title:"\u57fa\u7840\u53c2\u6570",description:"container",source:"@site/docs/zh-cn/Options.md",sourceDirName:"zh-cn",slug:"/zh-cn/options",permalink:"/document/zh-cn/options",tags:[],version:"current",sidebarPosition:2,frontMatter:{title:"\u57fa\u7840\u53c2\u6570",sidebar_position:2,slug:"/zh-cn/options"},sidebar:"zh-cn",previous:{title:"\u5feb\u901f\u4e0a\u624b",permalink:"/document/zh-cn"},next:{title:"\u5e38\u7528\u5c5e\u6027",permalink:"/document/zh-cn/propertie"}},o=[{value:"container",id:"container",children:[],level:2},{value:"url",id:"url",children:[],level:2},{value:"Ready Callback",id:"ready-callback",children:[],level:2},{value:"poster",id:"poster",children:[],level:2},{value:"title",id:"title",children:[],level:2},{value:"theme",id:"theme",children:[],level:2},{value:"volume",id:"volume",children:[],level:2},{value:"isLive",id:"islive",children:[],level:2},{value:"muted",id:"muted",children:[],level:2},{value:"autoplay",id:"autoplay",children:[],level:2},{value:"autoSize",id:"autosize",children:[],level:2},{value:"autoMini",id:"automini",children:[],level:2},{value:"loop",id:"loop",children:[],level:2},{value:"flip",id:"flip",children:[],level:2},{value:"playbackRate",id:"playbackrate",children:[],level:2},{value:"aspectRatio",id:"aspectratio",children:[],level:2},{value:"screenshot",id:"screenshot",children:[],level:2},{value:"setting",id:"setting",children:[],level:2},{value:"hotkey",id:"hotkey",children:[],level:2},{value:"pip",id:"pip",children:[],level:2},{value:"mutex",id:"mutex",children:[],level:2},{value:"fullscreen",id:"fullscreen",children:[],level:2},{value:"fullscreenWeb",id:"fullscreenweb",children:[],level:2},{value:"subtitleOffset",id:"subtitleoffset",children:[],level:2},{value:"miniProgressBar",id:"miniprogressbar",children:[],level:2},{value:"useSSR",id:"usessr",children:[],level:2},{value:"playsInline",id:"playsinline",children:[],level:2},{value:"layers",id:"layers",children:[],level:2},{value:"settings",id:"settings",children:[],level:2},{value:"contextmenu",id:"contextmenu",children:[],level:2},{value:"controls",id:"controls",children:[],level:2},{value:"quality",id:"quality",children:[],level:2},{value:"highlight",id:"highlight",children:[],level:2},{value:"plugins",id:"plugins",children:[],level:2},{value:"whitelist",id:"whitelist",children:[],level:2},{value:"thumbnails",id:"thumbnails",children:[],level:2},{value:"subtitle",id:"subtitle",children:[],level:2},{value:"moreVideoAttr",id:"morevideoattr",children:[],level:2},{value:"icons",id:"icons",children:[],level:2},{value:"type",id:"type",children:[],level:2},{value:"customType",id:"customtype",children:[],level:2},{value:"lang",id:"lang",children:[],level:2},{value:"lock",id:"lock",children:[],level:2},{value:"autoPlayback",id:"autoplayback",children:[],level:2},{value:"autoOrientation",id:"autoorientation",children:[],level:2}],u={toc:o};function k(e){var t=e.components,n=(0,l.Z)(e,i);return(0,r.kt)("wrapper",(0,a.Z)({},u,n,{components:t,mdxType:"MDXLayout"}),(0,r.kt)("h2",{id:"container"},"container"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String\u3001Element")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"#artplayer")),(0,r.kt)("li",{parentName:"ul"},"\u5fc5\u586b: ",(0,r.kt)("inlineCode",{parentName:"li"},"\u662f"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u6240\u6302\u8f7d\u7684 ",(0,r.kt)("inlineCode",{parentName:"p"},"dom")," \u5bb9\u5668\uff0c\u5176\u5fc5\u987b\u662f\u5177\u6709\u5c3a\u5bf8\u7684\uff0c\u5426\u5219\u64ad\u653e\u5668\u65e0\u6cd5\u663e\u793a"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n // container: document.querySelector('.artplayer-app'),\n url: '/assets/sample/video.mp4',\n});\n")),(0,r.kt)("p",null,"\u60a8\u53ef\u80fd\u9700\u8981\u521d\u59cb\u5316\u5bb9\u5668\u5143\u7d20\u7684\u5927\u5c0f\uff0c\u5982:"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-css"},".artplayer-app {\n width: 400px;\n height: 300px;\n}\n")),(0,r.kt)("h2",{id:"url"},"url"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''")),(0,r.kt)("li",{parentName:"ul"},"\u5fc5\u586b: ",(0,r.kt)("inlineCode",{parentName:"li"},"\u662f"))),(0,r.kt)("p",null,"\u89c6\u9891\u6e90\u5730\u5740\uff0c\u9ed8\u8ba4\u652f\u6301\u4e09\u79cd\u89c6\u9891\u6587\u4ef6\u683c\u5f0f\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},".mp4"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".ogg"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".webm")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n});\n")),(0,r.kt)("h2",{id:"ready-callback"},"Ready Callback"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Function")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"undefined"))),(0,r.kt)("p",null,"\u6784\u9020\u51fd\u6570\u63a5\u53d7\u4e00\u4e2a\u51fd\u6570\u4f5c\u4e3a\u7b2c\u4e8c\u4e2a\u53c2\u6570\uff0c\u64ad\u653e\u5668\u521d\u59cb\u5316\u6210\u529f\u4e14\u89c6\u9891\u53ef\u4ee5\u64ad\u653e\u65f6\u89e6\u53d1\uff0c\u548c",(0,r.kt)("inlineCode",{parentName:"p"},"ready"),"\u4e8b\u4ef6\u4e00\u6837"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n muted: true,\n}, function() {\n this.play();\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u56de\u8c03\u51fd\u6570\u91cc\u7684",(0,r.kt)("inlineCode",{parentName:"p"},"this"),"\u5c31\u662f\u64ad\u653e\u5668\u5b9e\u4f8b\uff0c\u4f46\u56de\u8c03\u51fd\u6570\u5047\u5982\u4f7f\u7528\u4e86\u7bad\u5934\u51fd\u6570\uff0c",(0,r.kt)("inlineCode",{parentName:"p"},"this"),"\u5219\u4e0d\u4f1a\u6307\u5411\u64ad\u653e\u5668\u5b9e\u4f8b"))),(0,r.kt)("h2",{id:"poster"},"poster"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u89c6\u9891\u7684\u6d77\u62a5\uff0c\u53ea\u4f1a\u51fa\u73b0\u5728\u64ad\u653e\u5668\u521d\u59cb\u5316\u4e14\u672a\u64ad\u653e\u7684\u72b6\u6001\u4e0b"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n poster: '/assets/sample/poster.jpg',\n});\n")),(0,r.kt)("h2",{id:"title"},"title"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u89c6\u9891\u6807\u9898\uff0c\u76ee\u524d\u4f1a\u51fa\u73b0\u5728\u89c6\u9891\u622a\u56fe\u548c\u8ff7\u4f60\u6a21\u5f0f\u4e0b"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n title: '\u3010\u65b0\u6d77\u8bda\u52a8\u753b\u3011\u300e\u79d2\u901f5\u30bb\u30f3\u30c1\u30e1\u30fc\u30c8\u30eb\u300f',\n screenshot: true,\n});\n")),(0,r.kt)("h2",{id:"theme"},"theme"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"#f00"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u4e3b\u9898\u989c\u8272\uff0c\u76ee\u524d\u53ea\u4f5c\u7528\u4e8e\u8fdb\u5ea6\u6761\u4e0a"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n theme: '#ffad00',\n});\n")),(0,r.kt)("h2",{id:"volume"},"volume"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Number")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"0.7"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u7684\u9ed8\u8ba4\u97f3\u91cf"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n volume: 0.5,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u64ad\u653e\u5668\u4f1a\u7f13\u5b58\u6700\u540e\u4e00\u6b21\u97f3\u91cf\u7684\u5927\u5c0f\uff0c\u4e0b\u6b21\u521d\u59cb\u5316\u65f6\uff08\u5982\u5237\u65b0\u9875\u9762\uff09\u64ad\u653e\u5668\u4f1a\u8bfb\u53d6\u8be5\u7f13\u5b58\u503c"))),(0,r.kt)("h2",{id:"islive"},"isLive"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u4f7f\u7528\u76f4\u64ad\u6a21\u5f0f\uff0c\u4f1a\u9690\u85cf\u8fdb\u5ea6\u6761\u548c\u64ad\u653e\u65f6\u95f4"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n isLive: true,\n});\n")),(0,r.kt)("h2",{id:"muted"},"muted"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u9ed8\u8ba4\u9759\u97f3"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n muted: true,\n});\n")),(0,r.kt)("h2",{id:"autoplay"},"autoplay"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u81ea\u52a8\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n autoplay: true,\n muted: true,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u5047\u5982\u5e0c\u671b\u9ed8\u8ba4\u8fdb\u5165\u9875\u9762\u5c31\u80fd\u81ea\u52a8\u64ad\u653e\u89c6\u9891\uff0c",(0,r.kt)("inlineCode",{parentName:"p"},"muted")," \u5fc5\u9700\u4e3a ",(0,r.kt)("inlineCode",{parentName:"p"},"true"),"\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u9605\u8bfb ",(0,r.kt)("a",{parentName:"p",href:"https://developers.google.com/web/updates/2017/09/autoplay-policy-changes"},"Autoplay Policy Changes")))),(0,r.kt)("h2",{id:"autosize"},"autoSize"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u64ad\u653e\u5668\u7684\u5c3a\u5bf8\u9ed8\u8ba4\u4f1a\u586b\u5145\u6574\u4e2a ",(0,r.kt)("inlineCode",{parentName:"p"},"container")," \u5bb9\u5668\u5c3a\u5bf8\uff0c\u6240\u4ee5\u7ecf\u5e38\u51fa\u73b0\u9ed1\u8fb9\uff0c\u8be5\u503c\u80fd\u81ea\u52a8\u8c03\u6574\u64ad\u653e\u5668\u5c3a\u5bf8\u4ee5\u9690\u85cf\u9ed1\u8fb9"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"// \u7f29\u653e\u6d4f\u89c8\u5668\u7a97\u53e3\u67e5\u770b\u6548\u679c\nvar art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n autoSize: true,\n});\n")),(0,r.kt)("h2",{id:"automini"},"autoMini"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u5f53\u64ad\u653e\u5668\u6eda\u52a8\u5230\u6d4f\u89c8\u5668\u89c6\u53e3\u4ee5\u5916\u65f6\uff0c\u81ea\u52a8\u8fdb\u5165\u8ff7\u4f60\u64ad\u653e\u6a21\u5f0f"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n autoMini: true,\n});\n")),(0,r.kt)("h2",{id:"loop"},"loop"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5faa\u73af\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n loop: true,\n});\n")),(0,r.kt)("h2",{id:"flip"},"flip"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u7ffb\u8f6c\u529f\u80fd\uff0c\u76ee\u524d\u53ea\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u91cc\uff0c\u6240\u4ee5\u9700\u8981\u540c\u65f6\u8bbe\u7f6e ",(0,r.kt)("inlineCode",{parentName:"p"},"setting")," \u4e3a ",(0,r.kt)("inlineCode",{parentName:"p"},"true")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n flip: true,\n setting: true,\n});\n")),(0,r.kt)("h2",{id:"playbackrate"},"playbackRate"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u64ad\u653e\u901f\u5ea6\u529f\u80fd\uff0c\u4f1a\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u548c ",(0,r.kt)("inlineCode",{parentName:"p"},"\u53f3\u952e\u83dc\u5355")," \u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n playbackRate: true,\n setting: true,\n});\n")),(0,r.kt)("h2",{id:"aspectratio"},"aspectRatio"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u663e\u793a\u89c6\u9891\u957f\u5bbd\u6bd4\u529f\u80fd\uff0c\u4f1a\u51fa\u73b0\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"\u8bbe\u7f6e\u9762\u677f")," \u548c ",(0,r.kt)("inlineCode",{parentName:"p"},"\u53f3\u952e\u83dc\u5355")," \u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n aspectRatio: true,\n setting: true,\n});\n")),(0,r.kt)("h2",{id:"screenshot"},"screenshot"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u89c6\u9891\u622a\u56fe\u529f\u80fd"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n screenshot: true,\n // \u53ef\u9009\n moreVideoAttr: {\n crossOrigin: 'anonymous',\n },\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u7531\u4e8e\u6d4f\u89c8\u5668\u5b89\u5168\u673a\u5236\uff0c\u5047\u5982\u89c6\u9891\u6e90\u5730\u5740\u548c\u7f51\u7ad9\u662f\u8de8\u57df\u7684\uff0c\u53ef\u80fd\u4f1a\u51fa\u73b0\u622a\u56fe\u5931\u8d25"))),(0,r.kt)("h2",{id:"setting"},"setting"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u8bbe\u7f6e\u9762\u677f\u7684\u5f00\u5173\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n setting: true,\n});\n")),(0,r.kt)("h2",{id:"hotkey"},"hotkey"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u662f\u5426\u4f7f\u7528\u5feb\u6377\u952e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n hotkey: true,\n});\n")),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u70ed\u952e"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2191")),(0,r.kt)("td",{parentName:"tr",align:null},"\u589e\u52a0\u97f3\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2193")),(0,r.kt)("td",{parentName:"tr",align:null},"\u964d\u4f4e\u97f3\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2190")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5feb\u8fdb 5 \u79d2")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"\u2192")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5feb\u9000 5 \u79d2")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"space")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5207\u6362\u64ad\u653e/\u6682\u505c")))),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u53ea\u5728\u64ad\u653e\u5668\u83b7\u5f97\u7126\u70b9\u540e\uff08\u5982\u70b9\u51fb\u4e86\u64ad\u653e\u5668\u540e\uff09\uff0c\u8be5\u5feb\u6377\u952e\u624d\u4f1a\u751f\u6548"))),(0,r.kt)("h2",{id:"pip"},"pip"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u753b\u4e2d\u753b\u7684\u5f00\u5173\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n pip: true,\n});\n")),(0,r.kt)("h2",{id:"mutex"},"mutex"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u5047\u5982\u9875\u9762\u91cc\u540c\u65f6\u5b58\u5728\u591a\u4e2a\u64ad\u653e\u5668\uff0c\u662f\u5426\u53ea\u80fd\u8ba9\u4e00\u4e2a\u64ad\u653e\u5668\u64ad\u653e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n mutex: true,\n});\n")),(0,r.kt)("h2",{id:"fullscreen"},"fullscreen"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u64ad\u653e\u5668\u7a97\u53e3\u5168\u5c4f\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n fullscreen: true,\n});\n")),(0,r.kt)("h2",{id:"fullscreenweb"},"fullscreenWeb"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u64ad\u653e\u5668\u7f51\u9875\u5168\u5c4f\u6309\u94ae"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n fullscreenWeb: true,\n});\n")),(0,r.kt)("h2",{id:"subtitleoffset"},"subtitleOffset"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u5b57\u5e55\u65f6\u95f4\u504f\u79fb\uff0c\u8303\u56f4\u5728 ",(0,r.kt)("inlineCode",{parentName:"p"},"[-5s, 5s]")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n subtitle: {\n url: '/assets/sample/subtitle.srt',\n },\n setting: true,\n subtitleOffset: true,\n});\n")),(0,r.kt)("h2",{id:"miniprogressbar"},"miniProgressBar"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u8ff7\u4f60\u8fdb\u5ea6\u6761\uff0c\u53ea\u5728\u64ad\u653e\u5668\u5931\u53bb\u7126\u70b9\u540e\u4e14\u6b63\u5728\u64ad\u653e\u65f6\u51fa\u73b0"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n miniProgressBar: true,\n});\n")),(0,r.kt)("h2",{id:"usessr"},"useSSR"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u4f7f\u7528 ",(0,r.kt)("inlineCode",{parentName:"p"},"SSR")," \u6302\u8f7d\u6a21\u5f0f\uff0c\u5047\u5982\u4f60\u5e0c\u671b\u5728\u64ad\u653e\u5668\u6302\u8f7d\u524d\uff0c\u5c31\u63d0\u524d\u6e32\u67d3\u597d\u64ad\u653e\u5668\u6240\u9700\u7684",(0,r.kt)("inlineCode",{parentName:"p"},"HTML"),"\u65f6\u6709\u7528"),(0,r.kt)("p",null,"\u4f60\u53ef\u4ee5\u901a\u8fc7",(0,r.kt)("inlineCode",{parentName:"p"},"Artplayer.html"),"\u8bbf\u95ee\u5230\u64ad\u653e\u5668\u6240\u9700\u7684",(0,r.kt)("inlineCode",{parentName:"p"},"HTML")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var $container = document.querySelector('.artplayer-app');\n$container.innerHTML = Artplayer.html;\n\nvar art = new Artplayer({\n container: $container,\n url: '/assets/sample/video.mp4',\n useSSR: true,\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"SSR \u662f Server Side Render \u7b80\u79f0\uff0c\u9875\u9762\u4e0a\u7684\u5185\u5bb9\u662f\u901a\u8fc7\u670d\u52a1\u7aef\u6e32\u67d3\u751f\u6210\u7684\uff0c\u6d4f\u89c8\u5668\u76f4\u63a5\u663e\u793a\u670d\u52a1\u7aef\u8fd4\u56de\u7684 HTML \u5c31\u53ef\u4ee5\u4e86\u3002"))),(0,r.kt)("h2",{id:"playsinline"},"playsInline"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u5728\u79fb\u52a8\u7aef\u662f\u5426\u4f7f\u7528 playsInline \u6a21\u5f0f"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n playsInline: true,\n});\n")),(0,r.kt)("h2",{id:"layers"},"layers"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u4e1a\u52a1\u56fe\u5c42"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var img = '/assets/sample/layer.png';\nvar art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n layers: [\n {\n index: 1,\n name: 'potser',\n disable: false,\n html: `<img style=\"width: 100px\" src=\"${img}\">`,\n style: {\n position: 'absolute',\n top: '20px',\n right: '20px',\n opacity: '.9',\n },\n click: function (...args) {\n console.info('\u4f60\u70b9\u51fb\u4e86\u7ec4\u4ef6');\n art.layers.show = false;\n },\n mounted: function (...args) {\n console.info('\u7ec4\u4ef6\u6302\u8f7d\u5b8c\u6210');\n },\n },\n ],\n});\n")),(0,r.kt)("h2",{id:"settings"},"settings"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u8bbe\u7f6e\u9762\u677f\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u8bbf\u95ee ",(0,r.kt)("a",{parentName:"p",href:"/document/zh-cn/Questions/How%20to%20add%20setting%20panel"},"\u600e\u4e48\u6dfb\u52a0\u8bbe\u7f6e\u9762\u677f")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n setting: true,\n settings: [\n {\n html: '\u81ea\u5b9a\u4e49\u8bbe\u7f6e01',\n selector: [\n {\n html: '\u5b50\u83dc\u535501',\n },\n {\n html: '\u5b50\u83dc\u535502',\n },\n ],\n onSelect: function (item) {\n console.log(item.html);\n },\n },\n {\n html: '\u81ea\u5b9a\u4e49\u8bbe\u7f6e02',\n selector: [\n {\n html: '\u5b50\u83dc\u535501',\n },\n {\n html: '\u5b50\u83dc\u535502',\n },\n ],\n onSelect: function (item) {\n console.log(item.html);\n },\n },\n ],\n});\n")),(0,r.kt)("h2",{id:"contextmenu"},"contextmenu"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u53f3\u952e\u83dc\u5355"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n contextmenu: [\n {\n html: '\u81ea\u5b9a\u4e49\u83dc\u5355',\n click: function () {\n console.info('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u83dc\u5355');\n art.contextmenu.show = false;\n },\n },\n ],\n});\n\nart.on('ready', () => {\n art.contextmenu.show = true;\n});\n")),(0,r.kt)("h2",{id:"controls"},"controls"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u5e95\u90e8\u63a7\u5236\u680f"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"disable")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u662f\u5426\u7981\u7528\u7ec4\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u552f\u4e00\u540d\u79f0\uff0c\u7528\u4e8e\u6807\u8bb0\u7c7b\u540d")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"index")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7d22\u5f15\uff0c\u7528\u4e8e\u663e\u793a\u7684\u4f18\u5148\u7ea7")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"html")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"Element")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684 DOM \u5143\u7d20")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6837\u5f0f\u5bf9\u8c61")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"click")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u70b9\u51fb\u4e8b\u4ef6")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"mounted")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Function")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u6302\u8f7d\u540e\u89e6\u53d1")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"tooltip")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u7ec4\u4ef6\u7684\u63d0\u793a\u6587\u672c")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"position")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u4f4d\u7f6e\u5728 ",(0,r.kt)("inlineCode",{parentName:"td"},"left")," \u6216\u8005 ",(0,r.kt)("inlineCode",{parentName:"td"},"right"))))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n controls: [\n {\n disable: false,\n name: 'button',\n index: 10,\n position: 'right',\n html: '\u81ea\u5b9a\u4e49\u6309\u94ae',\n tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a1',\n style: {\n color: 'red',\n },\n click: function () {\n console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae1');\n },\n mounted: function () {\n console.log('\u81ea\u5b9a\u4e49\u6309\u94ae\u6302\u8f7d\u5b8c\u62101');\n },\n },\n {\n position: 'left',\n html: '\u81ea\u5b9a\u4e49\u6309\u94ae2',\n tooltip: '\u81ea\u5b9a\u4e49\u6309\u94ae\u7684\u63d0\u793a2',\n style: {\n color: 'green',\n },\n click: function () {\n console.log('\u4f60\u70b9\u51fb\u4e86\u81ea\u5b9a\u4e49\u6309\u94ae2');\n },\n },\n ],\n});\n")),(0,r.kt)("h2",{id:"quality"},"quality"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u5e95\u90e8\u63a7\u5236\u680f\u91cc\u663e\u793a\u753b\u8d28\u9009\u62e9\u5217\u8868"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"default")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Boolean")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ed8\u8ba4\u753b\u8d28")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"name")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u753b\u8d28\u540d\u5b57")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u753b\u8d28\u5730\u5740")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n quality: [\n {\n default: true,\n html: 'SD 480P',\n url: '/assets/sample/video.mp4',\n },\n {\n html: 'HD 720P',\n url: '/assets/sample/video.mp4',\n },\n ],\n});\n")),(0,r.kt)("h2",{id:"highlight"},"highlight"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u5728\u8fdb\u5ea6\u6761\u4e0a\u663e\u793a\u9ad8\u4eae\u4fe1\u606f\u70b9"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"time")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ad8\u4eae\u65f6\u95f4\uff08\u5355\u4f4d\u79d2\uff09")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"text")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9ad8\u4eae\u6587\u672c")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n highlight: [\n {\n time: 60,\n text: 'One more chance',\n },\n {\n time: 120,\n text: '\u8c01\u3067\u3082\u3044\u3044\u306f\u305a\u306a\u306e\u306b',\n },\n {\n time: 180,\n text: '\u590f\u306e\u60f3\u3044\u51fa\u304c\u307e\u308f\u308b',\n },\n {\n time: 240,\n text: '\u3053\u3093\u306a\u3068\u3053\u306b\u3042\u308b\u306f\u305a\u3082\u306a\u3044\u306e\u306b',\n },\n {\n time: 300,\n text: '\uff0d\uff0d\u7ec8\u308f\u308a\uff0d\uff0d',\n },\n ],\n});\n")),(0,r.kt)("h2",{id:"plugins"},"plugins"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u7684\u63d2\u4ef6"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"function myPlugin(art) {\n console.info('\u4f60\u53ef\u4ee5\u5728\u63d2\u4ef6\u91cc\u8bbf\u95ee\u5230\u64ad\u653e\u5668\u7684\u5b9e\u4f8b');\n return {\n name: 'myPlugin',\n something: '\u81ea\u5b9a\u4e49\u5bfc\u51fa\u7684\u5c5e\u6027',\n doSomething: function () {\n console.info('\u81ea\u5b9a\u4e49\u5bfc\u51fa\u7684\u65b9\u6cd5');\n },\n };\n}\n\nvar art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n plugins: [myPlugin],\n});\n\nart.on('ready', () => {\n console.info(art.plugins.myPlugin.something);\n console.info(art.plugins.myPlugin.doSomething());\n});\n")),(0,r.kt)("h2",{id:"whitelist"},"whitelist"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Array")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"[]"))),(0,r.kt)("p",null,"\u56e0\u4e3a\u4e0d\u540c\u7684\u79fb\u52a8\u8bbe\u5907\u5b58\u5728\u591a\u79cd\u5dee\u5f02\u548c\u9650\u5236\uff0c\u6240\u4ee5\u672c\u64ad\u653e\u5668\u9ed8\u8ba4\u5728\u79fb\u52a8\u8bbe\u5907\u4e0a\u4f7f\u7528\u539f\u751f\u65b9\u6cd5\u6302\u8f7d\u89c6\u9891\uff0c\u5047\u5982\u4f60\u60f3\u5728\u79fb\u52a8\u8bbe\u5907\u4e0a\u4f7f\u7528\u672c\u64ad\u653e\u5668\uff0c\u9700\u8981\u624b\u52a8\u5f00\u542f\u767d\u540d\u5355"),(0,r.kt)("p",null,"\u767d\u540d\u5355\u662f\u4e00\u4e2a\u6570\u7ec4\u7c7b\u578b\uff0c\u5206\u522b\u4e0e ",(0,r.kt)("inlineCode",{parentName:"p"},"window.navigator.userAgent")," \u8fdb\u884c\u5339\u914d\uff0c\u53ea\u8981\u5176\u4e2d\u4e00\u9879\u5339\u914d\u6210\u529f\u5219\u542f\u7528\u64ad\u653e\u5668"),(0,r.kt)("p",null,"\u652f\u6301",(0,r.kt)("inlineCode",{parentName:"p"},"\u5b57\u7b26\u4e32"),"\u5339\u914d\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"\u51fd\u6570"),"\u5339\u914d\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"\u6b63\u5219"),"\u5339\u914d"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n // whitelist: [(ua) => /iPhone OS 11/gi.test(ua)],\n // whitelist: [/iPhone OS 11/gi],\n // whitelist: ['iPhone OS 11'],\n whitelist: ['*'],\n});\n")),(0,r.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,r.kt)("div",{parentName:"div",className:"admonition-heading"},(0,r.kt)("h5",{parentName:"div"},(0,r.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,r.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,r.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"\u63d0\u793a")),(0,r.kt)("div",{parentName:"div",className:"admonition-content"},(0,r.kt)("p",{parentName:"div"},"\u5047\u5982\u5e0c\u671b\u5168\u90e8\u7c7b\u578b\u7684\u79fb\u52a8\u8bbe\u5907\u90fd\u542f\u7528\u64ad\u653e\u5668\uff0c\u8bbe\u7f6e ",(0,r.kt)("inlineCode",{parentName:"p"},"whitelist")," \u4e3a\u901a\u914d\u7b26 ",(0,r.kt)("inlineCode",{parentName:"p"},"['*']")," \u5373\u53ef"))),(0,r.kt)("h2",{id:"thumbnails"},"thumbnails"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u5728\u8fdb\u5ea6\u6761\u4e0a\u8bbe\u7f6e\u9884\u89c8\u56fe"),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u5730\u5740")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"number")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u6570\u91cf")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"column")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Number")),(0,r.kt)("td",{parentName:"tr",align:null},"\u9884\u89c8\u56fe\u5217\u6570")))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n thumbnails: {\n url: '/assets/sample/thumbnails.png',\n number: 100,\n column: 10,\n },\n});\n")),(0,r.kt)("h2",{id:"subtitle"},"subtitle"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u8bbe\u7f6e\u89c6\u9891\u7684\u5b57\u5e55\uff0c\u652f\u6301\u5b57\u5e55\u683c\u5f0f\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},"vtt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"srt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"ass")),(0,r.kt)("table",null,(0,r.kt)("thead",{parentName:"table"},(0,r.kt)("tr",{parentName:"thead"},(0,r.kt)("th",{parentName:"tr",align:null},"\u5c5e\u6027"),(0,r.kt)("th",{parentName:"tr",align:null},"\u7c7b\u578b"),(0,r.kt)("th",{parentName:"tr",align:null},"\u63cf\u8ff0"))),(0,r.kt)("tbody",{parentName:"table"},(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"url")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u5730\u5740")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"type")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u7c7b\u578b\uff0c\u53ef\u9009 ",(0,r.kt)("inlineCode",{parentName:"td"},"vtt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"srt"),"\u3001",(0,r.kt)("inlineCode",{parentName:"td"},"ass"))),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"style")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"Object")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u6837\u5f0f")),(0,r.kt)("tr",{parentName:"tbody"},(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"encoding")),(0,r.kt)("td",{parentName:"tr",align:null},(0,r.kt)("inlineCode",{parentName:"td"},"String")),(0,r.kt)("td",{parentName:"tr",align:null},"\u5b57\u5e55\u7f16\u7801\uff0c\u9ed8\u8ba4 ",(0,r.kt)("inlineCode",{parentName:"td"},"utf-8"))))),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n subtitle: {\n url: '/assets/sample/subtitle.srt',\n type: 'srt',\n encoding: 'utf-8',\n style: {\n color: '#03A9F4',\n 'font-size': '30px',\n },\n },\n});\n")),(0,r.kt)("h2",{id:"morevideoattr"},"moreVideoAttr"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{'controls': false,'preload': 'metadata'}"))),(0,r.kt)("p",null,"\u66f4\u591a\u89c6\u9891\u5c5e\u6027\uff0c\u8fd9\u4e9b\u5c5e\u6027\u5c06\u76f4\u63a5\u5199\u5165\u89c6\u9891\u5143\u7d20\u91cc"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n moreVideoAttr: {\n 'webkit-playsinline': true,\n playsInline: true,\n },\n});\n")),(0,r.kt)("h2",{id:"icons"},"icons"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u7528\u4e8e\u66ff\u6362\u9ed8\u8ba4\u56fe\u6807\uff0c\u652f\u6301 ",(0,r.kt)("inlineCode",{parentName:"p"},"Html")," \u5b57\u7b26\u4e32"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n icons: {\n loading: '<img src=\"/assets/img/ploading.gif\">',\n state: '<img src=\"/assets/img/state.png\">',\n play: '',\n pause: '',\n volume: '',\n volumeClose: '',\n subtitle: '',\n screenshot: '',\n setting: '',\n fullscreen: '',\n fullscreenWeb: '',\n pip: '',\n indicator: '',\n },\n});\n")),(0,r.kt)("h2",{id:"type"},"type"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"''"))),(0,r.kt)("p",null,"\u7528\u4e8e\u6307\u660e\u89c6\u9891\u7684\u683c\u5f0f\uff0c\u9700\u8981\u914d\u5408 ",(0,r.kt)("inlineCode",{parentName:"p"},"customType")," \u4e00\u8d77\u4f7f\u7528\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u8bbf\u95ee ",(0,r.kt)("a",{parentName:"p",href:"/document/zh-cn/libraries"},"\u7b2c\u4e09\u65b9\u5e93")),(0,r.kt)("p",null,"\u9ed8\u8ba4\u89c6\u9891\u7684\u683c\u5f0f\u5c31\u662f\u89c6\u9891\u5730\u5740\u7684\u540e\u7f00\uff08\u5982 ",(0,r.kt)("inlineCode",{parentName:"p"},".flv"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".mkv"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},".ts"),"\uff09\uff0c\u4f46\u6709\u65f6\u5019\u89c6\u9891\u5730\u5730\u5740\u6ca1\u6709\u6b63\u786e\u7684\u540e\u7f00\uff0c\u6240\u4ee5\u9700\u8981\u7279\u522b\u6307\u660e"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.flv',\n type: 'flv',\n});\n")),(0,r.kt)("h2",{id:"customtype"},"customType"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Object")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"{}"))),(0,r.kt)("p",null,"\u901a\u8fc7\u89c6\u9891\u7684\u683c\u5f0f\u8fdb\u884c\u5339\u914d\uff0c\u628a\u89c6\u9891\u89e3\u7801\u6743\u4ea4\u7ed9\u7b2c\u4e09\u65b9\u7a0b\u5e8f\u8fdb\u884c\u5904\u7406\uff0c\u66f4\u591a\u4fe1\u606f\u8bf7\u8bbf\u95ee ",(0,r.kt)("a",{parentName:"p",href:"/document/zh-cn/libraries"},"\u7b2c\u4e09\u65b9\u5e93")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.flv',\n customType: {\n flv: function (video, url, art) {\n // video: \u89c6\u9891dom\u5143\u7d20\n // url: \u89c6\u9891\u5730\u5740\n // art: \u5f53\u524d\u5b9e\u4f8b\n },\n },\n});\n")),(0,r.kt)("h2",{id:"lang"},"lang"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"String")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"navigator.language.toLowerCase()"))),(0,r.kt)("p",null,"\u9ed8\u8ba4\u663e\u793a\u8bed\u8a00\uff0c\u76ee\u524d\u652f\u6301\uff1a",(0,r.kt)("inlineCode",{parentName:"p"},"en"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"zh-cn"),"\u3001",(0,r.kt)("inlineCode",{parentName:"p"},"zh-tw")),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n lang: 'en',\n});\n")),(0,r.kt)("h2",{id:"lock"},"lock"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"true"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u79fb\u52a8\u7aef\u663e\u793a\u4e00\u4e2a\u9501\u5b9a\u6309\u94ae\uff0c\u7528\u4e8e\u9690\u85cf\u5e95\u90e8\u63a7\u5236\u680f"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n lock: true,\n});\n")),(0,r.kt)("h2",{id:"autoplayback"},"autoPlayback"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u4f7f\u7528\u81ea\u52a8\u56de\u653e\u529f\u80fd"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n muted: true,\n autoplay: true,\n autoPlayback: true,\n});\n")),(0,r.kt)("h2",{id:"autoorientation"},"autoOrientation"),(0,r.kt)("ul",null,(0,r.kt)("li",{parentName:"ul"},"\u7c7b\u578b: ",(0,r.kt)("inlineCode",{parentName:"li"},"Boolean")),(0,r.kt)("li",{parentName:"ul"},"\u9ed8\u8ba4: ",(0,r.kt)("inlineCode",{parentName:"li"},"false"))),(0,r.kt)("p",null,"\u662f\u5426\u5728\u79fb\u52a8\u7aef\u7684\u7f51\u9875\u5168\u5c4f\u65f6\uff0c\u6839\u636e\u89c6\u9891\u5c3a\u5bf8\u548c\u89c6\u53e3\u5c3a\u5bf8\uff0c\u65cb\u8f6c\u64ad\u653e\u5668"),(0,r.kt)("div",{className:"run-code"},"\u25b6 Run Code"),(0,r.kt)("pre",null,(0,r.kt)("code",{parentName:"pre",className:"language-js"},"var art = new Artplayer({\n container: '.artplayer-app',\n url: '/assets/sample/video.mp4',\n autoOrientation: true,\n});\n")))}k.isMDXComponent=!0}}]);