在项目中须要做一个播放器，还要实现歌词同步的效果，就跟如今搜狗音乐的歌词同步差点儿相同，在网上查了一些关于这方面的。整理了一下，在这里，其有用这种方法能够吗？

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8" />

		<title></title>

		<script type="text/javascript" src="js/jquery.min.js" ></script>

		<script type="text/javascript">

			window.setInterval("dd()",200);

			var i=0;

			function dd(){

				i=i+10;

				//alert(i)

				document.getElementById("mydiv2").style.width=i+"px";

			}

			function x(){

				//alert("-----")

				document.getElementById("mydiv2").style.color="red";

			}

		</script>

	</head>

	<body>

        <div class="mydiv1" style="position: absolute; z-index: 1;">

        	<h1>影月莹莹哈哈哈哈哈哈</h1>

        </div>

        <div  class="mydiv2" id="mydiv2" style="position: absolute; z-index:2; color: blue; width: 100px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">

        	<h1>影月莹莹哈哈哈哈哈哈</h1>

        </div>

        <button id="mybutton" onclick="x()" style="height: 100px; width: 200px; margin-top: 100px;">电机 </button>

	</body>

</html>

在这里。。我用了一个这样的方法。不知行不行的通 。。至于歌词同步，就调时间吧。向网上一些博客，，看了都是须要AJAX解析歌曲文件，获取歌词，歌词时间。实现歌词同步，在这里。假设仅仅是一两首歌曲，自己调一调时间也行吧。。。。。至于大家有什么看法。。额额。。。嘿嘿

我的项目7 js 实现歌词同步（额，小小的效果）的更多相关文章

  1. 基于jplayer实现歌词同步的JS音乐播放器效果

    分享一款基于jplayer实现歌词同步的JS音乐播放器效果.这是一款基于jQuery实现的音乐播放器功能代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <textare ...

  2. 论HTML5 Audio 标签歌词同步的实现

    HTML5草案里面其实有原生的字幕标签(<track> Tag)的,但使用的是vtt格式的文件,非常规的字幕(.sub, .srt)或歌词文件(.lrc). 用法如下(代码来自W3Scho ...

  3. Jplayer歌词同步显示插件

    http://blog.csdn.net/wk313753744/article/details/38758317 1.该插件是一个jquery的编写的跟jplayer实现歌词同步的插件,最终效果如图 ...

  4. HTML5实践之歌词同步播放器

    歌曲播放我们会发现他的兼容性不是很好,譬如IE上能播放的flash播放器,再firfox或者chrome上就不是很好的应用了,因为有插件的阻碍!HTML5的出现让这一切成为了可能,但是播放器虽然播放了 ...

  5. Android VLC播放器二次开发3——音乐播放(歌曲列表+歌词同步滚动)

    今天讲一下对VLC播放器音频播放功能进行二次开发,讲解如何改造音乐播放相关功能.最近一直在忙着优化视频解码部分代码,因为我的视频播放器需要在一台主频比较低的机器上跑(800M主频),所以视频解码能力受 ...

  6. HTML5实现歌词同步

    开篇 HTML5的最强大之处莫过于对媒体文件的处理,如利用一个简单的vedio标签就能够实现视频播放.相似地,在HTML5中也有相应的处理音频文件的标签,那就是audio标签 在线Demo audio ...

  7. 用HTML5的Audio标签做一个歌词同步的效果

    HTML5出来这么久了,但是关于它里面的audio标签也就用过那么一次,当然还仅仅只是把这个标签插入到了页面中.这次呢就刚好趁着帮朋友做几个页面,拿这个audio标签来练练手. 首先你需要向页面中插入 ...

  8. TextView实现歌词同步

    利用TextView实现歌词同步显示,这是一个简单的利用TextView实现滚动实时显示歌词的. 里面的内容都已经写上了详细的注释.里面播放音乐的时候歌词同步展示. 做媒体这块的朋友可以学习一下,练练 ...

  9. 关于js中的同步和异步

    最近看到前端面试问到js中的同步和异步,这个问题该怎么回答? 梳理一下,js对于异步的处理,很多人的第一反应是ajax,这只能说是对了一半. 1.个人觉得,js中,最基础的异步是setTimeout和 ...

随机推荐

  1. poj 1984 并查集

    题目意思是一个图中,只有上下左右四个方向的边.给出这样的一些边, 求任意指定的2个节点之间的距离. 就是看不懂,怎么破 /* POJ 1984 并查集 */ #include <stdio.h& ...

  2. bzoj 4766: 文艺计算姬 -- 快速乘

    4766: 文艺计算姬 Time Limit: 1 Sec  Memory Limit: 128 MB Description "奋战三星期,造台计算机".小W响应号召,花了三星期 ...

  3. PAT甲级1057. Stack

    PAT甲级1057. Stack 题意: 堆栈是最基础的数据结构之一,它基于"先进先出"(LIFO)的原理.基本操作包括Push(将元素插入顶部位置)和Pop(删除顶部元素).现在 ...

  4. 思科DCHP解决方案

    DHCP功能平时用的不算少,而且本人的几乎所有的DHCP功能都是在交换机上实现的,虽然也可以通过PC实现,而且PC的DHCP Server功能还更完善,比如可以不受DHCP作用域的限制.IP分配情况直 ...

  5. 开发笔记：python与随机数(转)

    这些天需要用到从一堆数中随机提取几个数,于是重新研究了下random模块. 下面介绍下random中常见的函数. 前提:需要导入random模块 >>>import random 1 ...

  6. 创建自己的Repo Server

    非常久曾经出于好奇细致了解了下Repo及server的原理,可是今天突然发现有些忘了.于是想记录下来. Repo机制 Repo是google官方为管理Android项目开发出来的一个软件. 我们先来看 ...

  7. d3.js 实现立体柱图

    前言 随着大数据时代的来临,数据可视化的重要性也越来越凸显,那么今天就基于d3.js今天给大家带来可视化基础图表柱图进阶:立体柱图 关于d3.js d3.js是一个操作svg的图表库,d3封装了图表的 ...

  8. JAVAssist---动态改动注解

    ​ITOOV3.0開始了,须要研究一些技术难点,先来说一个我认为比較有趣的技术点吧.需求是这种.我们须要动态的切换数据源,又因为我们是通过实体单元的注入来完毕的.实体单元是通过注解的形式注入的.这样假 ...

  9. 在 Linux 系统中安装Load Generator ，并在windows 调用

    原文地址:http://www.blogjava.net/qileilove/archive/2012/03/14/371861.html 由于公司需要测试系统的最大用户承受能力,所以需要学习使用lo ...

  10. pytest文档3-pycharm运行pytest

    前言 上一篇pytest文档2-用例运行规则已经介绍了如何在cmd执行pytest用例,平常我们写代码在pycharm比较多 写完用例之后,需要调试看看,是不是能正常运行,如果每次跑去cmd执行,太麻 ...