文章列表
facebook，人人网都推出了“时间线”或叫“时间轴”，用于以时间段来查看用户的行为。
时间线呈现类似这样的效果：
每个单元框是一个li，如何按时间顺序将他们排列在时间轴的两端呢？这里注意每个单元框的高度都不一样，因为用户每个时刻做的行为是不同的。所以不能都用float:left来写，否则会是这样的效果：
显然左右单元框都没有错落排列，不是我们想要的效果。
解决方法：单元框分成两列，奇偶相隔，左列框一律float:left，右列框一律float:right。这在框高度不一致的情况下也出了问题，这是因为浏览器会自动去补左右的高度差，用右边的单元框去补左边的空档。
...
var a = new Function("document.write(a)");
var b = function(){document.write(b);}
function c(){
document.write(c);
}
a();
b();
c();
执行后结果为：abc 后两种定义方式较常用，其中变量b是指向匿名函数的一个引用,c是一个被赋予了函数体的函数。对第一种方式，在查询了若干资料后做一个小结。
Function 是Javascript的內置对象，而function（注意大小写）就是从 ...
循环
循环是很常用的一个控制结构，大部分东西要依靠它来完成，在JavaScript中，我们可以使用for(;;),while(),for(in) 三种循环，事实上，这三种循环中for(in)的效率极差，因为他需要查询散列键，只要可以就应该尽量少用。for(;;)和w ...
1. viewport：也就是可视区域。对于桌面浏览器，我们都很清楚viewport是什么，就是出去了所有工具栏、状态栏、滚动条等等之后用于看网页的区域，这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变view ...
移动平台前端开发是指针对高端智能手机（如Iphone、Android）做站点适配也就是WebApp，并非是针对普通手机开发Wap 2.0，所以在阅读本篇文章以前，你需要对webkit内核的浏览器有一定的了解，需要对HTML5和CSS3有一定的了解。1、首先 ...
用谷歌浏览器来当手机模拟器【转载】
- 博客分类：
- 移动web
转载自http://blog.s135.com/chrome_phone by 张宴
很多网站都通过User-Agent来判断浏览器类型，如果是3G手机，显示手机页面内容，如果是普通浏览器，显示普通网页内容。 谷歌Chrome浏览器，可以很方便地用来当3G手机模拟器。在Windows的【开始】-->【运行】中输入以下命令，启动谷歌浏览器，即可模拟相应手机的浏览器去访问3G手机网页： 谷歌Android：chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/F ...
【dunhuangmi原创，转载注明】
highcharts（http://www.highcharts.com/）是一款功能强大的绘图插件，基于VML和SVG开发，基本可以能兼容所有的浏览器。在它基础上可以开发柱状图、折线图、饼图等各种统计图表，并且效果绚丽。
本文只是一个简单的应用示例，希望可以帮助大家缩短学习highcharts的时间。
项目需求是实现如下效果的统计饼图，鼠标移到不同的扇区上时页面其他区域会相应产生变化，如果数据有变化可以实时重绘。
开发这样一个页面，我们需要知道以下几点：1、绘图数据源的格式和引用方法；2、饼图及注释显示的颜色、大小等样式设定；3 ...
[dunhuangmi原创]大名鼎鼎的node.js是个javascript执行环境。有了它，我们可以用js作很多更好玩的事情。
目前在windows下安装node.js已经不需要先安装cygwin了
到这里下载node.js安装包直接运行安装即可
http://nodejs.org/dist/v0.8.16/node-v0.8.16-x86.msi
（遇更新刷新http://nodejs.org/download/）
安装完毕，点击
所有程序->Node.js(x86)->Node.js Command Prompt，出现cmd命令行窗口。
用文本编辑器保存t ...
【dunhuangmi原创，转载注明】
一、如何让a和input写的button看起来一致
网页上的按钮通常是用a或input两种方式来展现的。
a标签的写法很简单，定义display:block或inline-block之后，可以给按钮长宽，字体高度，使之居中
同上可以定义input[type="button"]的样式，ie6+和其他主流浏览器都支持改变input的背景字体颜色。
那么我们假如把css写成这样：
.abtn{float:left;display:inline-block; margin:0;padding:0;colo ...
【dunhuangmi原创】这篇用HTML5做个循环播放歌曲的音频播放器。视频音频的控制方法差不多，因此做视频播放器时也可以参考本文。
为了省事，没有引用jquery，所有用到的元素都用id而不是class来控制，各id名字起的也不好，结构性比较差，你们看着有点晕，我写的也有点晕，呵呵。还有时间有限，鼠标事件控制尽量用最简单的方法来写，所以后面看到音量控制那里写的很不好，有bug。
UI模仿doubanfm.com做的，很简单的样子：
想省事的话，audio和vedio都可以用自带的播放控件，但在各个浏览器里显示的效果均不同，无法改变，为了好效果还是要自己做播放控件。
...
dunhuangmi的话：记得还是生手时面过某知名公司，题目之一是两个嵌套div，鼠标走对角线经过父与子时究竟会触发几个mouseover和mouseout事件？我当时答错了
，下面这篇文章解释了这个问题。
===================================================================
描述
：
javascript的mouseover和mouseout事件，在绑定元素内部有子元素的情况下，
经过绑定元素时会多次触发mouseover和mouseout事件。
原因
：
当鼠标经过或离开子元素的时候，浏览器认为这样也 ...
注：原创文章，转载注明原作者为dunhuangmi。
通常根据数据生成统计图，有柱状图，饼状图，折线图等等不同类型。柱状图可以通过js控制css的变化实现，比较简单。但是画圆必须用flash、svg或html5来实现。
下面介绍一下用html5实现如下饼图的原理
我们都知道，用html5绘图需要使用CanvasRenderingContext2D对象提供的各种API，画圆需要用到arc()。
它的写法是arc(x, y, radius, startAngle, endAngle, counterclockwise)，具体含义可查手册。
于是我们画一个π/6（30度）扇形 ...
判断useragent是来自普通pc，还是来自移动设备。普通pc打开index-pc.html，移动设备打开index-m.html
var deviceAgent = navigator.userAgent.toLowerCase();
var agentID = deviceAgent.match(/(iphone|ipod|ipad|android)/);
if(agentID){
if(agentID.indexOf("iphone")>=0 || agentID.indexOf("ipod")>=0 || agentI ...