feili2011-CSDN博客

timeline时间线的实现方法

facebook，人人网都推出了“时间线”或叫“时间轴”，用于以时间段来查看用户的行为。时间线呈现类似这样的效果：每个单元框是一个li，如何按时间顺序将他们排列在时间轴的两端呢？这里注意每个单元框的高度都不一样，因为用户每个时刻做的行为是不同的。所以不能都用float:left来写，否则会是这样的效果：显然左右单元框都没有错落排列，不是我们想要的效果。解决方法...

2013-04-09 18:24:25 1495

原创 JavaScript之Function和function简单区分

var a = new Function("document.write(a)"); var b = function(){document.write(b);} function c(){ document.write(c); } a(); b(); c(); 执行后结果为：abc 后两种定义方式较常用，其中变量b是指向匿名函...

2013-03-15 17:58:50 124

原创转：如何优化JavaScript脚本的性能

循环循环是很常用的一个控制结构，大部分东西要依靠它来完成，在JavaScript中，我们可以使用for(;;),while(),for(in) 三种循环，事实上，这三种循环中for(in)的效率极差，因为他需要查询散列键，只要可以就应该尽量少用。for(;;)和while循环的性能应该说基本（平时使用时）等价。而事实上，如何使用这两个循环，则有很大讲究。我在测试中有些很有意思的情况，见...

2013-03-11 21:46:47 88

原创移动平台前端开发要点（二）

1. viewport：也就是可视区域。对于桌面浏览器，我们都很清楚viewport是什么，就是出去了所有工具栏、状态栏、滚动条等等之后用于看网页的区域，这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport;实际上我们可以操作的属性有4 个：width - // viewport 的宽度（范围从200 到10,000，默认...

2013-01-16 14:25:06 142

原创移动平台前端开发要点

移动平台前端开发是指针对高端智能手机（如Iphone、Android）做站点适配也就是WebApp，并非是针对普通手机开发Wap 2.0，所以在阅读本篇文章以前，你需要对webkit内核的浏览器有一定的了解，需要对HTML5和CSS3有一定的了解。1、首先我们来看看webkit内核中的一些私有的meta标签，这些meta标签在开发webapp时起到非常重要的作用 (1)<meta...

2013-01-16 14:16:18 121

原创用谷歌浏览器来当手机模拟器【转载】

转载自http://blog.s135.com/chrome_phone by 张宴很多网站都通过User-Agent来判断浏览器类型，如果是3G手机，显示手机页面内容，如果是普通浏览器，显示普通网页内容。　　谷歌Chrome浏览器，可以很方便地用来当3G手机模拟器。在Windows的【开始】-->【运行】中输入以下命令，启动谷歌浏览器，即可模拟相应手机的浏览器去访问3G手机网页：　...

2013-01-16 11:56:34 201

原创用highcharts插件画动态饼图的实例

【dunhuangmi原创，转载注明】highcharts（http://www.highcharts.com/）是一款功能强大的绘图插件，基于VML和SVG开发，基本可以能兼容所有的浏览器。在它基础上可以开发柱状图、折线图、饼图等各种统计图表，并且效果绚丽。本文只是一个简单的应用示例，希望可以帮助大家缩短学习highcharts的时间。项目需求是实现如下效果的统计饼图，鼠...

2013-01-09 15:38:01 314

原创在window环境中安装node.js

[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://node...

2013-01-04 11:29:14 123

原创解决浏览器兼容问题，呈现一致按钮（input和a元素）

【dunhuangmi原创，转载注明】一、如何让a和input写的button看起来一致网页上的按钮通常是用a或input两种方式来展现的。a标签的写法很简单，定义display:block或inline-block之后，可以给按钮长宽，字体高度，使之居中同上可以定义input[type="button"]的样式，ie6+和其他主流浏览器都支持改变input...

2012-12-25 15:04:31 484

[HTML5系列实践之二]用HTML5做音频播放器

【dunhuangmi原创】这篇用HTML5做个循环播放歌曲的音频播放器。视频音频的控制方法差不多，因此做视频播放器时也可以参考本文。为了省事，没有引用jquery，所有用到的元素都用id而不是class来控制，各id名字起的也不好，结构性比较差，你们看着有点晕，我写的也有点晕，呵呵。还有时间有限，鼠标事件控制尽量用最简单的方法来写，所以后面看到音量控制那里写的很不好，有bug。UI模仿d...

2012-12-14 16:07:17 242

原创 mouseover和mouseout的BUG

dunhuangmi的话：记得还是生手时面过某知名公司，题目之一是两个嵌套div，鼠标走对角线经过父与子时究竟会触发几个mouseover和mouseout事件？我当时答错了，下面这篇文章解释了这个问题。===================================================================描述：javascript的mou...

2012-12-10 18:06:08 188

原创 [HTML5系列实践之一]用HTML5做动态饼图

注：原创文章，转载注明原作者为dunhuangmi。通常根据数据生成统计图，有柱状图，饼状图，折线图等等不同类型。柱状图可以通过js控制css的变化实现，比较简单。但是画圆必须用flash、svg或html5来实现。下面介绍一下用html5实现如下饼图的原理我们都知道，用html5绘图需要使用CanvasRenderingContext2D对象提供的各种API，画圆需要...

2012-12-08 23:08:39 1091

区分PC还是移动设备useragent的javascript代码

判断useragent是来自普通pc，还是来自移动设备。普通pc打开index-pc.html，移动设备打开index-m.html[code="javascript"] var deviceAgent = navigator.userAgent.toLowerCase(); var agentID = deviceAgent.match(/(iphone|ipod|ipad|androi...

2012-05-25 15:53:07 166

feili2011的博客