菜单

html5音录制播放及CSS效果样式搭配

2019年8月15日 - 皇家前端

如今一直在商量html5情形下样式效果表现难点,htm5的竹签越来越从简,结合jquery和bootstrap3,能够很好地做出自个儿想要的可比靓丽的页面特效。

 

 

此处介绍下音录制播放用到的js库:

 

 

旋律播放:

 

audio.js

 

由此下边几步轻便消除:

 

Installation

Put audio.js, player-graphics.gif & audiojs.swf in the same folder.

 

Include the audio.js file:

 

<script src=”/audiojs/audio.min.js”></script>

Initialise audio.js:

 

<script>

  audiojs.events.ready(function() {

    var as = audiojs.createAll();

  });

</script>

Then you can use <audio> wherever you like in your HTML:

 

<audio src=”/mp3/juicy.mp3″ preload=”auto” />

摄像播放:

 

video-js

 

 

 

透过上边几步也得以轻便化解:

 

 

<link href=”//example.com/path/to/video-js.css” rel=”stylesheet”>

<script src=”//example.com/path/to/video.js”></script>

<script>

  videojs.options.flash.swf = “”

</script>

 

<video id=”example_video_1″ class=”video-js vjs-default-skin”

  controls preload=”auto” width=”640″ height=”264″

  poster=””

  data-setup='{“example_option”:true}’>

 <source src=””
type=’video/mp4′ />

 <source src=””
type=’video/webm’ />

 <source src=””
type=’video/ogg’ />

</video>

 

最终效果:

图片 1

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图