标签归档:HTML5播放器

超炫酷的jQuery/HTML5音乐唱片播放器

之前我们分享过很多基于jQuery和HTML5的音乐播放器,播放器的外观也有着很大的不同,比如这款卡带式的古典音乐播放器,也有迷你型的jQuery音乐播放器jPlayer。今天要介绍的音乐播放器功能更加强大,确切地说,它是一款音乐唱片的播放器,里面收藏了跟多唱片集,以CD的外观形式来播放音乐,并且CD的两面都可以使用,切换非常方便。

jquery-html5-record-player

在线演示源码下载

超炫酷的HTML5视频播放器 支持手机移动页面

之前我们介绍过不少基于HTML5的视频播放器和音频播放器,有些都非常有个性,比如这款HTML5卡带式古典播放器超酷播放器UI界面的HTML5视频播放器。今天要分享的这款也是HTML5视频播放器,但它的特点是支持手机移动页面,播放器的尺寸可以自适应各种设备。

html5-video-player-mobile

在线演示源码下载

HTML5笑脸样式的音乐播放器 非常有爱

今天要来分享一款非常有爱的HTML5音乐播放器,它的外观酷似一张笑脸,其实笑脸的样式也是通过对播放器的各项按钮进行布局而产生的。同时这款播放器的功能也是比较完整的,播放、暂停、音量控制、播放进度等。

html5-smile-music-player

在线演示源码下载

HTML5古典风格的音乐播放器

还记得之前为大家分享过一款HTML5卡带式古典播放器,播放效果非常酷。这次要给大家带来的也是一款基于HTML5的古典风格的音乐播放器,它的样式是早期西洋的转盘式音乐盒,侧边有一栏播放器控制按钮,可以播放、暂停、上/下一曲、前进后退,是一款非常个性化的HTML5音乐播放器。

html5-classical-player

在线演示源码下载

质感炫酷的HTML5音乐播放器

之前我们分享过很多HTML5播放器了,有兴趣的朋友可以点开链接看看。今天我们要继续为大家介绍一款HTML5音乐播放器,这款播放器的背景是黑色质感状的,看起来非常炫酷。同时这款黑色的HTML5音乐播放器具备了最基本的音乐播放器功能。

html5-cool-audio-player

在线演示源码下载

HTML代码:

<div class="example">
	<div class="player">
		<div class="pl"></div>
		<div class="title"></div>
		<div class="artist"></div>
		<div class="cover"></div>
		<div class="controls">
			<div class="play"></div>
			<div class="pause"></div>
			<div class="rew"&gt[......]

阅读全文>>

HTML5视频播放器 超酷播放器UI界面

今天要分享一款UI界面非常出色HTML5视频播放器,播放器具备播放/暂停、音量调节、全拼播放等功能,应该也算是比较完善了的。我们也可以看看之前发布过的HTML5视频播放器,像HTML5播放器API集合 轻松学会HTML5播放器开发,也非常酷。

html5-mini-video-player

在线演示源码下载

HTML代码:

<section id="wrapper">
	<div class="videoContainer">

    <video id="myVideo" controls preload="auto" poster="css/vp_poster.jpg" width="380" >
      <source src="http://simplypx.com/images/Prometheus.mp4" type="video/mp4" />
		  <p>Your browser does not support the video tag.</p>
		</video>
		<div cla[......]

阅读全文>>

超酷HTML5环形音乐播放器 带播放列表

不久前我们已经分享过一款很酷的HTML5环形音乐播放器HTML5环形音乐播放器 播放器外观非常酷,今天我们要分享的HTML5音乐播放器也是环形的,和上一款不同的是这款HTML5环形音乐播放器可以有播放列表,用户可以选择音乐来播放。

html5-circle-audio-player

在线演示源码下载

HTML5迷你音乐播放器 3D翻转播放按钮

上一篇我们分享了一款外观很酷的HTML5音乐播放器,这次分享的播放器比较小巧迷你,虽然外观没有上一个播放器那么精致,但是功能却是很齐全的。该HTML5音乐播放器的特点是有一个3D的翻转播放按钮。当然对于HTML5播放器的外观,大家可以自己设计定义。

html5-audio-player-3d-button

在线演示源码下载

HTML5环形音乐播放器 播放器外观非常酷

之前我们分享过几款HTML5音乐播放器和视频播放器,像这款HTML5卡带式古典播放器HTML5视频播放器Video.Js非常不错。今天我要分享一款外观更酷的HTML5音乐播放器,该播放器是环形的,背景图片非常漂亮,可以控制播放、调整音量等播放器常用的功能。

html5-circle-music-player

在线演示源码下载

HTML5播放器API集合 轻松学会HTML5播放器开发

之前我们分享了两款不错的HTML5播放器,分别是HTML5视频播放器Video.JsHTML5播放器神话 卡带式古典播放器,效果都非常酷。今天我再分享一款最基本的HTML5视频播放器,这个播放器演示罗列了所有操作HTML5播放器的API,初学者可以更好的学习和使用HTML5播放器。

html5-video-api

在线演示源码下载

HTML代码:

<video id="video" controls="" preload="none" poster="http://media.w3.org/2010/05/sintel/poster.png">
      <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4">
       <p>Your user agent does not support the HTML5 Video element.</p>
 </video>
<div id="buttons"&g[......]

阅读全文>>