MediaElement.js HTML5 播放器 Z-BlogPHP 1

应用开发者 心扬 2017-8-20 1121

本帖最后由 心扬 于 2017-8-20 00:12 编辑

最初是应 @小咖啡 同学的需要,抽点空闲时间做的,基本功能已经OK,上线部署是没问题的,就是一些使用逻辑可能需要改进,权当发个公测收集 BUG 和意见吧,暂时不想发应用中心,有需要的直接拿去用,有什么意见或建议还请多指教。

最开始想直接做成UEditor插件的形式,后面又想着兼容其他的编辑器,就写得麻烦了些。目前插件只支持基于 UEditor (比如官方默认的UEditor和我的Neditor)的编辑器。
===================

什么是MediaElement.js?
HTML5 加入了<video>标签,它可以让你直接插入mp4、webm等格式的视频,但是这是浏览器默认的方式,播放的功能也比较单一,所以借助MediaElement.js可以实现丰富的播放效果。
MediaElement是一个HTML音频和视频解决方案,你可以:

  • 使用HTML5的视频和音频标签及其 CSS 生成播放器
  • 对于老的浏览器,使用自定义的 Flash 和 Silverlight 播放器来模拟 HTML5


目前MediaElement.js所能支持的浏览器如图:

===================

重要提示:
本插件依赖 Neditor编辑器(推荐) 或者 UEditor编辑器,请先安装并启用其中一个编辑器后再使用本插件。

使用方法:

  • 请到文章编辑页面,选择编辑器下方的对应添加按钮添加视频/音乐,提交文章后访问页面即可看到效果。
  • 媒体库与正文编辑器相互独立,媒体库只是一个暂时列出媒体的地方,请将媒体插入至正文中。只有正文中的媒体才是真正生效的,一切以正文为主。
  • 编辑/删除媒体库的媒体并不会影响正文的内容,正文中的媒体需要另外手动删除。如果更改了媒体库的媒体信息,请重新将媒体插入正文当中。


===================
效果图:编辑页面




添加对话框




前台页面
启用插件前


启用插件后



插件下载:
附件: 25627

最新回复 (1)
全部楼主
  • 应用开发者 xiaofeng 2017-8-21 0
    引用 1
    不错,赞一个

    小锋博客 承接网站开发、主题定制、仿站、修改等服务,QQ联系

    • ZBlogger技术交流中心
      3
          
返回