kingwell.leng
- 浏览: 147364 次
- 性别:
- 来自: 深圳
-
最新评论
-
陈颜宇：
prompt在哪啊，只看到了confirm 和 alert
给Jquery添加alert,prompt方法，类似系统的Alert，Prompt，可以响应键盘，支持拖动 -
陈小妞：
alert(el.getAttribute("cla ...
Javascript兼容性之——getAttribute(),setAttribute()（获取设置属性） -
I白I：
厉害。。。
HTML5实现全屏API【进入和退出全屏】 -
joyven：
...
Javascript兼容性之——getAttribute(),setAttribute()（获取设置属性） -
小林夕：
看看一个用canvas到极致的案例 ProcessOn
HTML5 Canvas实战——HTML5 Canvas时间效果
文章列表
0.5.3版本对Model数据验证时，绑定Error就可以了：
(function(){
var Model = Backbone.Model.extend({
initialize : function(){
this.bind('err
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta charset="utf-8" ...
使用Sass预定义一些常用的样式，非常方便
- 博客分类：
- CSS
各种新技术的出现，推动着Web前端技术飞速发展，在提升用户体验的同时也方便开发者；
在前端优化时，我们使用CSSSprite技术，把多个图片合在一张图片上，然后通过background-image，background-position来定位现实不同效果，这样来达到减少HTTP请求，毕竟HTTP请求是相当昂贵的，但是HTTP请求是少了，开发人员工作量就大了，要定位图片不是一件很方便的事情，非常麻烦，要一个一个地计算：
其实我们可以有点技巧，让图片排列有点规律，这样可以减少大量时间：
假如我们的图片是规律的，如每个区域高都是30px，这样我们可能通过结合Sass里for来快速现实对图片 ...
使用Sass预定义一些常用的样式，非常方便
- 博客分类：
- CSS
CSS预处理技术现在已经非常成熟，比较流行的有Less，Sass，Stylus，在开发过程中提升我们的工作效率，缩短开发时间，方便管理和维护代码，可以根据自己的喜好选择一款自己喜欢的工具开发，使用很接近，差别很小，语法类似。再选择一款编译工具koala，国产工具，koala是一个前端预处理器语言图形编译工具，支持Less、Sass、Compass、CoffeeScript，帮助web开发者更高效地使用它们进行开发。跨平台运行，完美兼容windows、linux、mac。还可以在node.js里编译。我使用的是SASS，使用SASS+Compass完胜LESS。
常用CSS预定义：
1：el ...
在最新的IE浏览器（IE10+）上使用表单时，文本框内后面会出现很丑的删除图标以及显示密码图标，如果你讨厌这个可以把它去掉，这两个是由IE私有属性控制：
input::-ms-clear,
input::-ms-reveal {
display: none; /* For ie10+ */
}
安装nodejs安装包后，通过npm安装express后，运行express提示" express"不是内部或外部命令。
c:\express -t ejs web
原因是版本问题，当前版本是4.0.0，改成3.5.0即可运行。
$ npm install -g express@3.5.0
现在主流浏览器基本上实现了全屏效果，但是不同浏览器实现不一样：
【进入和退出全屏】
// Webkit (works in Safari5.1 and Chrome 15)element.webkitRequestFullScreen();document.webkitCancelFullScreen(); // Firefox 10+element.mozRequestFullScreen();document.mozCancelFullScreen(); // W3C 提议element.requestFullscreen();document.exitFullscreen();
...
有时候网页中使用箭头以增强效果，一般的做法是使用图片，今天我们使用CSSCSS来实现“箭头效果”，使用CSS我们必须兼容所有浏览器（IE6、7、8、9、10、+），Chrome，Firefox，Opear...
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="Kingwell">
<meta ...
IE6不支持PNG-24图片一直困扰很多人，但是可以通过IE的独有的滤镜来解决，解决的方案很多，比如：将滤镜写在CSS里，还可以写成单独的Javascript文件，本来认为推荐两种做法：第一种，将所有PNG图片添加滤镜（此方法有副作用）；第二种：有选择性的添加滤镜（推荐）；两者都可以将代码放在单独的JS文件里，然后引用。
第一种：
直接添加如下代码：
function correctPNG() {
for (var i = 0; i < document.images.length; i++) {
var img = document.images[i ...
HTML之间的空白节点，会影响HTML排版，清除空白节点除了在定代码时注意，也可以通过JS清除：
为了重复利用，可以将它包装成一个函数：
function removeWhitespace(element) {
var elem = $$.Dom.getNode(element) || document,
cur = elem.firstChild,
tmp,
reg = /\S/;//这里最好将正则保存在一个变量里，如果在下面使用直接量，会造成一定的性能问题，直接量不是一个对象，所以它没有方法，系统在执行它时会临时包装一个空白对象，这样如果页面文件很大时，就会出现性 ...
IE中使用的事件绑定函数与Web标准的不同，而且this指向也不一样，Web标签中的this指向与传统事件绑定中的this一样，是当前目标，但是IE中事件绑定函数中this指向，通过使用call或apply可以改变this指针的指向。
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>attachEvent 中this指向</title>
<script ty ...
十六制作颜色转RGB格式：
function toRGB(color) {
if (typeof color !== 'string') {
return null;
}
var c = color.slice(1),
ca = [],
temp = '',
reg3 = /^[0-9a-f]{3}$/i,
reg6 = /^[0-9a-f]{6}$/i;
if (reg3.test(c)) {
for (var i = 0; i < c.length; i++) {
temp = c[i] + '' + c[i];
c ...
项目中经常要使用日历时间插件，网上也有很多很优秀的插件，但是我还是喜欢使用自己写的东西，第一比较符合自己项目需要，第二，维护，修改比较内容，第 三，代码也比较少，第四，兼容各主流浏览器(IE6,7,8,9,10,FF,Chrome,Opera等)。最近写了个日历与时间选择插件，支持中英文
查看效果
使用HTML5 navigator geolocation获取当前地理位子，并调用Gmap接口显示在地图上：
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin:0; padding:0;}
.kin ...
HTML5 Canvas实战
function clockTest() {
var canvas = document.getElementById('canvas');
if (!(canvas && canvas.getContext)) {
return;
}
var ct = canvas.getContext('2d');
var w = canvas.width = 500;
var h = canvas.height = 300;
var r1 = 95;
v ...