I\xe2\x80\x99m 使用 videojs-marker 插件（http://www.sampingchuang.com/videojs-markers）构建一个自定义播放器，用户可以通过它注释（命名一个人的动作）某些部分（不是只是视频的一个点），所以我的计划是使每个标记都有其适当的宽度（因此它可以覆盖此操作的持续时间）以及覆盖文本的适当显示时间。
\n\n<script>\nvar player = videojs("my-video", {\n controls: true,\n autoplay: false,\n preload: \'auto\',\n...\nplayer.markers({\n markerStyle: {\n \'width\':\'10px\',\n \'border-radius\': \'30%\',\n \'background-color\': \'#009DE0\'\n },\n markerTip:{\n display: true,\n text: function(marker) {\n return marker.text;\n },\n time: function(marker) {\n return marker.time;\n }\n },\n breakOverlay:{\n display: true,\n displayTime: 1,\n style:{\n \'width\':\'100%\',\n \'height\': \'20%\',\n \'background-color\': \'rgba(0,0,0,0.7)\',\n \'color\': \'white\',\n \'font-size\': \'17px\'\n },\n text: function(marker) {\n return marker.overlayText;\n }\n },\n onMarkerClick: function(marker) {},\n onMarkerReached: function(marker) {},\n markers: [\n {time: 9.5, text: "1",overlayText: \'attack\', class: \'custom-marker\'},\n …