HTMl5自由者

原创 利用Apache配置本地 自定义域名

第一步：配置 httpd.conf　　　　开启 虚拟主机 配置模块 去掉 " Include conf/extra/httpd-vhosts.conf "　　前面的" # "# Virtual hosts Includeconf/extra/httpd-vhosts.conf 第二步：配置 httpd-vhosts.conf　　　　开始 将自定义的本地域名 

原创 移动端开发心得（2015.3.1更新）

移动端开发心得

转载 wamp出现You don’t have permission to access/on this server提示

本地搭建wamp，输入http://127.0.0.1访问正常，当输入http://localhost/，apache出现You don't have permission to access/on this server.的提示，如何解决？找到httpd.conf，用记事本打开httpd.conf，然后将    Options FollowSymLinks  

转载 NodeJS、NPM安装配置步骤(windows版本)

1、windows下的NodeJS安装是比较方便的（v0.6.0版本之后，支持windows native），只需要登陆官网（http://nodejs.org/），便可以看到首页的“INSTALL”按钮，直接点击就会自动下载安装了。2、安装过程基本直接“NEXT”就可以了。（windows的安装msi文件在过程中会直接添加path的系统变量，变量值是你的安装路径，例如“C

原创 点击按钮复制链接到我的粘贴板【兼容所有浏览器】

首先看下个人的笔记：点击我兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能加载JQuery库和zclip插件script type="text/javascript" src="js/jquery-1.8.1.min.js">script> script src="js/jquery.zclip.min

转载 Hammer.js 移动设备触摸手势js库

hammer.js是一个多点触摸手势库，能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件，免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器，在桌面浏览器上，也能将鼠标的点击当做触摸，方便开发人员在桌面浏览器上调试。这是一个专为触摸手势而生的j

原创 attribute和property的区别

DOM元素的attribute和property很容易混倄在一起，分不清楚，两者是不同的东西，但是两者又联系紧密。很多新手朋友，也包括以前的我，经常会搞不清楚。attribute翻译成中文术语为“特性”，property翻译成中文术语为“属性”，从中文的字面意思来看，确实是有点区别了，先来说说attribute。attribute是一个特性节点，每个DOM元素都有一个对应的attr

转载 DOM对象属性(property)与HTML标签特性(attribute)

HTML中property与attribute是极易混淆的两个概念。大多数时候这两个单词都翻译为“属性”,为了区分二者，一般将property翻译为”属性”，attribute翻译为”特性”。每一个HTML标签(tag)都对应一个DOM接口HTMLXxxElement,比如Span标签对应的是HTMLSpanElement。这些标签的DOM接口都继承自HTMLElement接口，而HTML

原创 jQuery之使用jQuery.fn.prop()替换jQuery.fn.attr()

jQuery 使用jQuery.fn.prop()替换jQuery.fn.attr()  ，实现

转载 SASS用法指南

学过CSS的人都知道，它不是一种编程语言。你可以用它开发网页样式，但是没法用它编程。也就是说，CSS基本上是设计师的工具，不是程序员的工具。在程序员眼里，CSS是一件很麻烦的东西。它没有变量，也没有条件语句，只是一行行单纯的描述，写起来相当费事。很自然地，有人就开始为CSS加入编程元素，这被叫做"CSS预处理器"（css preprocessor）。它的基本思想是，用一种专

原创 HTML 5 <input> placeholder 属性兼容性解决办法

跨浏览器placehoder body{ font:12px/1.5 'simsun';} form{ width:300px; height:260px; margin:20px auto 0;} h3{ font-weight:bold; margin:10px 0;}

转载 CSS动画属性性能

CSS动画属性会触发整个页面的重排relayout、重绘repaint、重组recompositePaint通常是其中最花费性能的，尽可能避免使用触发paint的CSS动画属性，这也是为什么我们推荐在CSS动画中使用webkit-transform: translateX(3em)的方案代替使用left: 3em，因为left会额外触发layout与paint，而webkit-transfor

转载 网页图片压缩优化，提高网站打开速度

最大程度的压缩了网页大小，提高访问者的用户体验。对于一个网站而言，页面的开启速度是至关重要的。它不仅直接影响到该网站在搜索引擎中的排名参数，更为重要的是，会减缓访客的页面开启速度。图片优化基本原则：一、图片裁切切图时尽量贴合图形区，避免空白区域占用文件大小。二、图片缩放通常情况下，数码相机拍出的照片分辨率是用于冲洗照片所用的，在网上浏览不需要上传那么大的照片，既影响

原创 HTML5 Canvas知识点学习笔记

canvas  ① 主要作用：绘制矢量图② 矢量图图形（路径）-（ILL） 位图图像（像素点）- PS中图像都是位图③ Canvas 能够制作动画,但是不是为了制作动画而生的也能够制作游戏。主要为了绘图而生。④ 能够设置宽高 推荐样式写在style；Canvas 相当于是一个绘制图形的容器，并没有绘制功能，需要借助JS（脚本）实现绘制功能

转载 html5shiv.js分析

首先，我们先了解一下html5shiv.js是什么。html5shiv.js是一套实现让ie低版本等浏览器支持html5标签的解决方案。实现原理：见如何让ie低版本浏览器支持html5标签 。废话不多说，我们先上源代码，代码有点长，但保持原来的注释有利于大家理解，不想直接阅读的就点收缩代码然后往下看。源码原地址：https://github.com/aFarkas/html

原创 HTML5地理定位，百度地图API，知识点熟悉

判断浏览器的兼容问题：IE9+支持地理定位，FF Chrome新版支持地理定位 if (navigator.geolocation) {       alert('支持地理定位');  } else {        alert('不支持地理定位'); }获取自己位置经纬度          var x=d

转载 面向手机网站的前端开发

从09年初接手淘宝手机网站前端开发的工作至今，转眼已是一年。一步步看着手机淘宝从最初的beta版本到今天的样子，感慨良多。手机网站开发，有着许多不为人知的困难：一是可参考的资料太少，大部分手机网站都处于起步阶段，很多的时候都是摸着石头过河，而鉴于淘宝自身的特殊性，也使得我们在参考成功案例之余，要做更多的思考；二是兼容性工作异常艰辛，难度一点也不比web网站的兼容性工作来的低

原创 AJAX基础知识点学习

AJAX基础知识点学习（AJAX异步加载、JSON与XML辨析……）

转载 HTML5中x-webkit-speech语音输入功能

现在各大网站都在搜索框中加入了语音输入功能，不过目前只有Chrome 11及以上版本才支持。可以用chrome浏览器在这里试试效果，点击话筒即可：实现起来也非常简单，为input添加名为 x-webkit-speech 的属性就行了。相关的属性设置：lang设置语言种类：onwebkitspeechchange语音输入事件，当发声语音改变

原创 IE6下的怪异解析知识点补充

转载请注明出处：HTMl5自由者4月份写的一篇关于IE6 Bug 怪异解析（模式）的文章，现在重新理解了下，就再写一篇详细一点的文章来补充下知识点。怪异解析分两种情况；① 当padding+border 时，重点：padding + border width,padding + border忽略掉，算进width里面，也就

原创 BOM知识点笔记

BOM知识点笔记innerHeight  当前窗口文档显示区域的高（这里的宽度和高度不包括菜单栏、工具栏以及滚动条等的高度。）innerWidth   当前窗口文档显示区域的宽（这里的宽度和高度不包括菜单栏、工具栏以及滚动条等的高度。）outerHeight  当前窗口文档（包含菜单栏、控制台、边框）的高outerWidth   当前窗口文

原创 项目期复习：JS操作符，弹窗与调试，注释，数据类型转换

1、JS操作符① 除法运算后，是有小数存在的，跟C语言不同之处         var num = 67/4;         ----------> 输出：16.75         console.log(num);  ② 通常情况下，操作符与数值/变量之间需要有空格隔开       1） 赋值操作符  =       2） 算数操作符  + 、

原创 JavaScript发展史，与JScript区别，引入方式，数据类型，命名规范，命名推荐，解决命名冲突

目录：1、JavaScript发展史2、JavaScript与JScript区别3、JavaScript引入方式4、JavaScript基本数据类型及布尔值5、JavaScript命名规范6、JavaScript命名推荐7、JavaScript解决命名冲突1、 JavaScript发展史1.Netscape发明了Jav

原创 CSS3主要知识点复习总结+HTML5新增标签

分享2014-4-1 HTML5上课笔记2、CSS3属性（内核前缀）Mozilla 内核   css前缀-moz; WebKit  内核   css前缀-webkit ;（谷歌已换用blink内核）Opera   内核   css前缀 -o ;    （欧朋已换用blink内核）Trident 内核   css前缀 -ms ;

原创 JavaScript兼容问题汇总[实时更新]

JavaScript兼容问题汇总[实时更新]

转载 【htc法：IE-CSS3】CSS3支持IE6、IE7、IE8

【htc法：IE-CSS3】CSS3支持IE6、IE7、IE8摘要：IE-CSS3是提供一些CSS3标准新款式在即将到来的的Internet Explorer支持的脚本。IE-CSS3简介IE-CSS3是一种作用于IE浏览器的客户脚本，可以为一些CSS3支持度不好的低版本的IE浏览器（IE6、IE7和IE8）提供支持一些新的CSS3样式和标准。IE-CSS3的使用方

原创 PNG24图片兼容IE6解决办法

PNG24图片兼容IE6最好的解决办法

原创 testing....

原创 项目复习期总结3：CSS引入方式，注释，命名规范，背景，行高，文本属性

目录：1、CSS注释的书写 怎么写？好处？2、CSS引入方式  各种的优缺点3、选择器的写法与选择器的优先级4、CSS命名规范5、背景，行高6、文本(text与font开头)等所有属性① CSS注释书写规范：1、单行注释：      直接写在属性值的后面，如：

原创 cookie知识点简点

cookie几大作用：1.保持用户登陆状态2.跟踪用户行为3.制定页面4.创建购物车cookie缺点：1. 可能被禁用2.可能被删除：cookie是一个文件，容易被用户删除3.安全性不高4.cookie可能与浏览器相关设置cookie document.cookie = "userId = 100"; alert(document.cookie);设置多个值： document.cookie ="userId = 100;userPa

原创 项目期复习总结2：Table， DIV+CSS，标签嵌套规则

2014-5-12 晴 复习总结 ① 表格的意义，含义？表格应该用来展现那些适合表格化显示的信息,比如数据的显示，统计或者二维报表之类的信息，而不是作为一种而已的工作② 表格有哪些元素？表格元素：table thead tbody tfoot caption tr th td .... 较常用

原创 项目期复习总结1：背景图合并，hack，浏览器内核前缀，伪类after before

1、背景图合并和CSS Spirit2、PS基本快捷键3、hack技术基本书写，为什么不用？4、内核前缀5、伪类afterbefore 1、背景图合并和CSS Spirit 背景图合并在使用时有两种方法：①一种就是你会PS，可以自己PS实现背景图合并成一张图片，再用background-position实现背景图的定位。②如果你不会PS，那可

原创 JS中的onload与jQuery中的ready区别

JS中的onload与jQuery中的ready区别介绍

原创 [实时更新]jquery所有版本下载

jquery-2.1.0   注！不再支持IE 6/7/8直接引用地址: 开发版地址1: 压缩版地址1: 开发版地址2: 压缩版地址2: 点击下载2.1.0jquery-2.0.3   注！不再支持IE 6/7/

原创 jQuery动画animate的stop方法

jQuery动画animate的stop方法

原创 CSDN博客加句代码，显示自己的信息固定在一个位置

@Huan艺斌

转载 水平/垂直居中详解

.bc{margin-left:auto;margin-right:auto;}.pages1 li{float:left;display:inline;margin-right:5px;}.pages1 a{float:left;display:block;padding:0 9px; height:25px; line-height:25px;}

原创 字符串的加密与解密

一、JavaScript预定义编码与解码方法字符串常规编码与解码——escape（）和unescape（）     var str = 'HTML5 Free自由者';    str = escape(str);    console.log(str);     // HTML5%20Free%u81EA%u7531%u8005    str = u

原创 正则表达式常用知识点总结

正则表达式 ：① 利用某种模式去匹配一类字符串的公式，② 所有的字符串或数组的处理都可以使用正则进行简化处理var str = 'dsdfdgg545fdf';纯文本、字符replace（searchValue，replaceValue）方法：该方法在字符串中第一个出现的searchValue子字符串替换为replaceValue，并返回

原创 DOM节点操作知识点简要总结

1、什么是DOM？   Document Object Model （文档对象模型）DOM是针对文档的一个API接口   Dom描绘了一个层次化的节点树，允许开发人员添加，移除和修改页面的某一部分2、DOM树     ① 标签属于节点的一种 ② 节点包含了标签，注释，文本，doctype等在内的多种组合③ 在文档中出现的空格，回车，也属于节点