更新下前端相关笔记
color:red; /* 所有浏览器都支持 */
color:red !important;/* Firefox、IE7支持 */
_color:red; /* IE6支持 */
*color:red; /* IE6、IE7支持 */
+color:red;/*IE7支持*/
*+color:red; /* IE7支持 */
color:red\9; /* IE6、IE7、IE8支持 */
color:red\0; /* IE8、IE9支持 */
color:red\9\0; /*IE9 支持*/
/* webkit and opera */
@media all and (min-width: 0px){ div{padding:11px;} }
/* webkit */
@media screen and (-webkit-min-device-pixel-ratio:0){ div{padding:11px;} }
/* opera */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { div{padding:11px;} }
/* firefox * /
@-moz-document url-prefix(){ div{background-color:#cc0000;}} /* all firefox */
html>/**/body div, x:-moz-any-link, x:default {background-color:#66ff00;} /* newest firefox */
}
*html .xxx{
color:red;
}//IE6
*+html .xxx{
color:red;
}//IE7
body:nth-of-type(1) p{color:red;} /* Chrome、Safari支持 */
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
<!–[if IE 7]> = 等于 IE7
<!–[if lt IE 8]> = 小于 IE8（就是 IE7 或以下了啦）
<!–[if gte IE 8]> = 大于或等于 IE8
<meta http-equiv="x-ua-compatible" content="ie=7" />
把这段代码放到<head>里面，在ie8里面的页面解析起来就跟ie7一模一样的了
内联元素都支持：
display:inline-block;
块级元素IE6/7不支持此时用display:inline;zoom:1;来代替；
清除浮动：
.c{
zoom:1;
}
.c:after{
clear:both;
display:block;
height:0;
content:".";
visibility:hidden;
}
ie6下面有时候列表图标要鼠标点击或移动过去才显示；
给li列表加zoom:1或position:relative;
window.parent 是iframe页面调用父页面对象
javascript 刷新父窗口
window.opener.document.location.reload();
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico">
使用DD_belatedPNG解决IE6下PNG半透明问题,只需要一个理由,就是它支持backgrond-position与background-repeat.
http://dillerdesign.com/experiment/DD_belatedPNG/#download
使用DD_roundies解决ie圆角问题
http://dillerdesign.com/experiment/DD_roundies/
很好的博客网站主题
wordpress/themeforest
而IE6在这里有一个 bug，它每次都从服务器端读取背景图片，结果就是，若服务器反应较慢hover效果就会出现短暂的空白
随便在页面中哪个位置（head、body或者onload）调用上面提及的脚本，例如：
<script type="text/javascript">
document.execCommand("BackgroundImageCache", false, true);
</script>
加载flash(swfObject)
adobe提供的脚本
<script src="../js/AC_RunActiveContent.js" type="text/javascript"></script>
在需要显示flash的地方加入下面脚本，将flash路径改下就ok了。
这个脚本根据不同的浏览器用不同的标签显示flash(如object/embed).
用这个脚本主要是为了解决flash加载时要点击一次才能进行交互
<script type="text/javascript">
AC_FL_RunContent('codebase','https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','736','height','145','src','images/games_<%=localeString%>','flashvars','lagStr=<%=localeString%>','quality','high','wmode','transparent','pluginspage','https://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','images/games_<%=localeString%>');
</script>
用slideToggle()时发现
在IE8下margin有时失效，开始以为是jquery问题，后来发现是IE8的bug.
综合几个解决方案：
1.给父DIV加个看不见的边框
2.给父DIV设个:overflow:hidden或overflow:auto
3.把margin去掉换成底色的border,如margin-top:8px 换成border-top:8px solid #xxx;
3.给消失margin的标签加上浮动，比如float:left;
4.在消失margin-top的标签前面加个空的标签如<div></div>，或者用一个空的div将消失margin的标签包裹起来；或者用一个空的div将消失margin标签之前的内容包裹起来。
filter:fliph 内容翻转
filter:gray 内容变灰
http://blog.silentash.com/
http://www.w3school.com.cn/js/js_reference.asp
google jquery 引用：
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
//界面好：
http://www.position-absolute.com/articles/jquery-fade-and-slide-toggle-plugin/
http://www.jxwinter.cn/index.php/archives/tag/ie6
//content
forum
http://www.css-js.com
//question
有A页面 通过jquery的dialog和iframe加载B页面 而B页面也以同样的方法加载C页面 但B页面打开的dialog却限定在了B窗口中
请问如何让C页面所在的dialog跳出B页面？
//move dialog
http://www.cnblogs.com/caixw/archive/2010/08/09/jquery-plugin-dialog.html
offsetHeight clientHeight
http://www.cftea.com/c/751.asp
将 document.body 和 document.documentElement 一起应用，比如：document.documentElement.scrollLeft || document.body.scrollLeft（一般将 document.documentElement 写在前面），类似应用请参见：http://www.cftea.com/c/2008/06/U1FSRIC247DWTK2M.asp。
页面具有 DTD（或者说指定了 DOCTYPE）时，使用 document.documentElement。
页面不具有 DTD（或者说没有指定了 DOCTYPE）时，使用 document.body。
在 IE 和 Firefox 中均是如此。
为了兼容（不管有没有 DTD），可以使用如下代码：
var scrollTop = window.pageYOffset
|| document.documentElement.scrollTop
|| document.body.scrollTop
|| 0;
http://www.cftea.com 千一网络
http://www.zhangjingwei.com/ 源码分析
http://www.web600.net/html/editor/JavaScript/201008183953.html
http://flyzonemu.javaeye.com/blog/326582
addEvent
http://www.w2blog.net/view/353.html IE6 中 a:hover 的bug
2010=-09-12 Meizu m8
好书下载：
http://ajava.org/book/
good
http://preloaders.net/en/horizontal
loading img
http://www.cnblogs.com/JustinYoung/archive/2010/03/30/jquery-chajian.html 博客园justinyoung
15 个 JavaScript Web UI 库
http://news.csdn.net/a/20100519/218442.html
常用技术收集
http://banu.blog.163.com/blog/static/2314648201089836588/
IE6 hover span
有相对定位时，a:hover{position:relative;}
a:hover span{ position:absolute;}
http://www.happinesz.cn/archives/991/
IE6 position:fixed/absolute
比较详细的javascript /css /ajax...
http://www.web666.net/dom/cancelBubble.html
浏览器的两种模式quirks mode 和strict mode
http://kino.javaeye.com/blog/241260
w3help:
http://www.w3help.org/zh-cn/
forum:
http://bbs.51cto.com/forum-137-1.html
http://forum.csdn.net/SList/CrossBrowser
drag
http://www.koyoz.com/blog/?action=show&id=80
obj.offset[Width|Height|Top|Left] 取控件相对于父控的位置
event.offset[X|Y] 取鼠标相对触发事件的控件中的坐标
event.screen[X|Y] 鼠标相对于屏幕坐标
event.client[X|Y] 鼠标相对于网页坐标
obj.scroll[Width|Height|Top|Left] 获取对象滚动的大小
obj.client[Width|Height|Top|Left] 获取对象可见区域的大小
解释一下event.X和event.clientX有什么区别？
event.clientX返回事件发生时,mouse相对于客户窗口的X坐标
event.X也一样
但是如果设置事件对象的定位属性值为relative
event.clientX不变
而event.X返回事件对象的相对于本体的坐标
event对象详解 ICOOE 2000.3.31 http://www.51js.com/
event代表事件的状态，例如事件发生的的元素、鼠标的位置等等，event对象只在事件过程中才有效。
event属性：
altKey
检索ALT键的当前状态
可能的值 true为关闭
false为不关闭
button
检索按下的鼠标键
可能的值： 0 没按键
1 按左键
2 按右键
3 按左右键
4 按中间键
5 按左键和中间键
6 按右键和中间键
7 按所有的键
cancelBubble
设置或检索当前事件是否将事件句柄起泡
可能的值： false 启用起泡
true 取消该事件起泡
clientX
检索与窗口客户区域有关的鼠标光标的X坐标，属性为只读，没有默认值。
clientY
检索与窗口客户区域有关的鼠标光标的Y坐标，属性为只读，没有默认值。
ctrlKey
ctrlKey 检索CTRL键的当前状态
可能的值 true为关闭
false为不关闭
dataFld
检索被oncellchange事伯影响的列
aTransfer
为拖放操作提供预先定义的剪贴板式。
Element
检索在on mouseover和on mouseout事件期间退出的对象指针
keyCode
设置或检索与引发事件的关键字相关联的Unicode关键字代码
该属性与onkeydown onkeyup onkeypress一起使用
如果没有引发事件的关键字，则该值为0
offsetX
检索与触发事件的对象相关的鼠标位置的水平坐标
offsetY
检索与触发事件的对象相关的鼠标位置的垂直坐标
propertyName
检索在对象上己更改的特性的名称
reason
检索数据源对象数据传输的结果
可能的值：
0 数据传输成功
1 数据传输失败
2 数据传输错误
recordset
检索数据源对象中默认记录集的引用
该特性为只读
repeat
检索一个事件是否被重复
该属性只有在onkeydown事件重复时才返回true
returnvalues
设置或检索从事件中返回的值
可能的值：
true 事件中的值被返回
false 源对象上事件的默认操作被取消
screenX
检索与用户屏相关的鼠标的水平位置
screenY
检索与用户屏相关的鼠标的垂直位置
shiftKey
检索shiftKey键的当前状态
可能的值 true为关闭
false为不关闭
srcElement
检索触发事件的对象
srcFilter
检索导致onfilterchange事件触发的过滤器对象
srcUm
检索触发事件行为的同一资源名称
除非下面两个条件都为真，否则该特性被设置为null
1.行为被附加到触发事件的要素上
2.在前面的项目符号中定义的行为己指定了一个URN标识符和己触发的事件
toElement
检索作为on mouseover或者on mouseout事件结果而移动的对象
type
检索事件对象中的事件名称
x
检索相对于父要素鼠标水平坐标的整数
y
检索相对于父要素鼠标垂直坐标的整数
计算网页内容的宽与高
http://www.javaeye.com/topic/563999
jQuery–20个最新的jQuery效果:
http://www.cssrain.cn/?p=1430
jquery 源码分析
http://www.zhangjingwei.com/archives/jquery-analysis-code-1/
http://www.aliue.com/index.php
http://help.dottoro.com/ljogqtqm.php
ellipsis:
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
-moz-binding: url('ellipsis.xml#ellipsis');
width:100px;
选中的文字背景：
http://daverupert.com/2010/06/web-performant-wordpress/
wijmo(基于jquery ui)
http://wijmo.com/
http://www.cnblogs.com/rubylouvre/archive/2010/11.html
网页常用js代码收集
http://www.cnblogs.com/lushuicongsheng/archive/2010/11/10/1874447.html1
看看
http://hi.baidu.com/mt20
zen-coding:
http://www.appinn.com/zen-coding/
downlist:http://code.google.com/p/zen-coding/downloads/list
小众软件：
http://www.appinn.com/
Free Image Convert And Resize (图片批量转换和调整大小) V2.0.8.5 多国语言免费
http://www.xiazaiba.com/word/Free+Image+Convert
canvas 教程
https://developer.mozilla.org/cn/canvas_tutorial
css优先级别：
id选择器>类选择器>标签选择器
important>内联样式(style="color:red")
desktop
http://desktop.sonspring.com/
去掉虚线框：
非IE:outline:none;
IE:在标签里面加属性HideFocus
http://www.js8.in/
http://www.cnblogs.com/sweetie/archive/2010/11/14/1877079.html
chrome 字体太小的问题：
-webkit-text-size-adjust:none;
font-size:10px;
wmode＝opaque 参数可以是FLASH位于最低，无法挡住下拉菜单，并且还能提高FLASH帧速，真是好参数
FALSH透明的参数为：wmode＝transparent
在线编辑调试页面
http://jsfiddle.net/
onchange,onpropertychange,oninput的区分:
http://roshanca.com/?p=95
http://roshanca.com/?s=%E9%97%AD%E5%8C%85 什么是闭包
for(var i=0;i<a.length;i++){
a[i].onclick = function(i){
return function(){
alert(i)
}
}(i)
}
http://www.cnblogs.com/jeffwongishandsome/archive/2009/05/17/1458405.html
程序男，热爱编程、思考和阅读，现主要从事.net平台下的web开发工作，对服务端和前端编程都有浓厚的兴趣。
http://www.cnblogs.com/jeffwongishandsome/
SWFObject is better than ac_ranActieContent
scroll、client、offsetWidth等获取、设置详解
http://www.easewe.com/Article/document/257.htm
//如果提供了事件对象，则这是一个非IE浏览器
if ( e && e.stopPropagation )
//因此它支持W3C的stopPropagation()方法
e.stopPropagation();
else
//否则，我们需要使用IE的方式来取消事件冒泡
window.event.cancelBubble = true;
return false;
2.阻止浏览器的默认行为
//如果提供了事件对象，则这是一个非IE浏览器
if ( e && e.preventDefault )
//阻止默认浏览器动作(W3C)
e.preventDefault();
else
//IE中阻止函数器默认动作的方式
window.event.returnValue = false;
return false;
添加事件：
if(obj.attachEvent){
obj.attachEvent("on" + handle,fn);
}else{
obj.addEventListener(handle,fn,false)
}
移除事件：
if(obj.attachEvent){
obj.detachEvent("on" + handle,fn);
}else{
obj.removeEventListener(handle,fn.false);
}
this.getPosition = function(obj) {
var x = obj.offsetLeft, y = obj.offsetTop;
while (obj && obj.offsetParent) {
x += obj.offsetParent.offsetLeft;
y += obj.offsetParent.offsetTop;
obj = obj.offsetParent;
}
return [x, y];
};
function getStyle(obj){
var obj = document.getElementById(obj);
return obj.currentStyle ? obj.currentStyle : document.defaultView.getComputedStyle(obj,null);
}
Object.prototype.extend
http://www.cnblogs.com/5201314/archive/2009/05/22/1487213.html
Object.extend = function(destination, source) {
for (var property in source) {
destination[property] = source[property];
}
return destination;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<body><SCRIPT LANGUAGE="JavaScript">
var s = "";
s += "\r\n网页可见区域宽："+ document.body.clientWidth;
s += "\r\n网页可见区域高："+ document.body.clientHeight;
s += "\r\n网页可见区域宽："+ document.body.offsetWidth +" (包括边线和滚动条的宽)";
s += "\r\n网页可见区域高："+ document.body.offsetHeight +" (包括边线的宽)";
s += "\r\n网页正文全文宽："+ document.body.scrollWidth;
s += "\r\n网页正文全文高："+ document.body.scrollHeight;
s += "\r\n网页被卷去的高："+ document.body.scrollTop;
s += "\r\n网页被卷去的左："+ document.body.scrollLeft;
s += "\r\n网页正文部分上："+ window.screenTop;
s += "\r\n网页正文部分左："+ window.screenLeft;
s += "\r\n屏幕分辨率的高："+ window.screen.height;
s += "\r\n屏幕分辨率的宽："+ window.screen.width;
s += "\r\n屏幕可用工作区高度："+ window.screen.availHeight;
s += "\r\n屏幕可用工作区宽度："+ window.screen.availWidth;
s += "\r\n你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
s += "\r\n你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
//alert(s);
for(a in document.body){
document.write(a);
document.write("----");
document.write(document.body[a]);
document.write("<br>");
}
</SCRIPT>
</BODY>
</HTML>
但上面得到的并不是窗口可见区域的尺寸（当网页没有占满整个窗口时）这时要得到高度和宽度
在IE下：document.documentElement.clientHeight
在其它浏览器下：window.innerHeight
http://webjcw.cn/dom/ref_window/innerheight.php
http://help.dottoro.com/ljknuajj.php
function fireEvent(element,event){
if (document.createEventObject){
// dispatch for IE
var evt = document.createEventObject();
return element.fireEvent('on'+event,evt)
}
else{
// dispatch for firefox + others
var evt = document.createEvent("HTMLEvents");
evt.initEvent(event, true, true ); // event type,bubbling,cancelable
return !element.dispatchEvent(evt);
}
}
designMode
http://www.code-design.cn/blogdetail2615.html
http://www.code-design.cn/blogdetail117.html
样式之美博客
http://www.aoao.org.cn/blog/
月影博客
http://www.silverna.org/blog/?p=73
http://bbs.51js.com/viewthread.php?tid=88174
<style type="text-css">
::-moz-selection { background:#f50; color:#fff;} // FF私有属性
::selection { background:#f50; color:#fff;} //其他非IE标准浏览器
.abc::selection{} /*abc为Class名称*/
.abc::-moz-selection{}
</style>
JavaScript颜色转换的核心
JavaScript颜色转换的核心就是进制间的转换。RGB格式其实就是十进制表示法，所以，十六进制颜色与RGB颜色的转换就是十六进制与十进制之间的转换。
十六进制转换为十进制相对容易些，核心代码如下示例：parseInt("0xFF")，其结果就是255，”0x”就表明当前是16进制，由于parseInt后面无参数，默认就是转换为10进制了。
十进制转换为16进制，核心代码如下：var num=255; num.toString(16);，其结果是FF。”16″表示数值转换为16进制字符串。
ajax如何控制浏览器的历史记录
http://www.qgy18.com/2008/09/howto_control_browser_history/
prototype:
http://w3er.com/javascript/master-javascript-object-system/#comment-102
http://css-tricks.com (a web design community)
http://css-tricks.com/downloads/
web标准化交流会
http://www.w3ctech.com/about
对于英文文章，只需要设定 text-align:justify; 就可以实现两端对齐，
如果作者主要致力于中文写作，则需要添加text-justify:inter-ideograph属性
http://uicss.cn/category/ue-seo/
使用HTML5开发的一些精彩应用:
http://homepage.yesky.com/165/11753665.shtml
http://www.9yuer.com/index.html
http://www.9yuer.com/thread-2825.html
网页制作后期细节开发
触发文字选择的事件：onselect=function(){return false;}适应于<input type='text'><textarea>
可以彻底禁止左右键~`＜body oncontextmenu="return false"＞如果禁止用鼠标选择和复制,则加上onselectstart="return false"
可以彻底禁止左右键~`
<body oncontextmenu="return false">
如果禁止用鼠标选择和复制,则加上
onselectstart="return false"
即是<body oncontextmenu="return false" onselectstart="return false">
如果禁止人家粘贴则加上
onpaste="return false"
即<body oncontextmenu="return false" onpaste="return false" >
禁止剪切
oncut='return false'
六、方法集锦
1. oncontextmenu="window.event.returnvalue=false" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)><td>no</table> 可用于Table
2. <body onselectstart="return false"> 取消选取、防止复制
3. onpaste="return false" 不准粘贴
4. oncopy="return false;" oncut="return false;" 防止复制
5. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标
6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标
7. <input style="ime-mode:disabled"> 关闭输入法
8. 永远都会带着框架
<script language="javascript"><!--
if (window == top)top.location.href = "frames.htm"; //frames.htm为框架网页
// -->
9. 防止被人frame
<SCRIPT LANGUAGE=javascript><!--
if (top.location != self.location)top.location=self.location;
// --></SCRIPT>
10. <noscript><iframe src=*.html></iframe></noscript> 网页将不能被另存为
http://www.wxwdesign.com/page/45 前端开发
http://xirang.ca/2009/12/rotating-snake-visual-illusion
http://varnow.org/?p=232 记录前端-记录成长
http://css9.net
模拟下拉列表: http://www.uur.cn/web/split/3-5_%E5%8D%95%E9%80%89%E4%B8%8B%E6%8B%89%E6%A1%86/demo.html
http://js1k.com canvas games
select option disable restyle /javascript drag study
http://www.53dns.com/ 互易中国 域名/空间
第六感
http://www.the6cn.com/web/javascript/index.shtml
浮动的内联元素里面再有浮动元素，则该内联元素宽度会100%；该元素里面的元素设置diaplay:inline-block可用
faststone:
FastStone Capture 6.7
http://www.newhua.com/soft/44264.htm
http://www.o2sky.cn/blog/
canvas资料：
http://forum.livetome.cn/thread-8588-1-1.html
http://www.html5.jp/
http://paranimage.com/html-5-canvas-tutorials-and-examples/
http://mozillalabs.com
http://www.xlnv.net
onPropertyChange onChange onInput事件:
http://hi.baidu.com/yljf184/blog/item/98df82df71fc731f62279876.html
前端：
http://www.ooso.net/
http://www.qianduan.net
http://www.cnblogs.com/zhenn/
获得选中的文字：
<script type="text/javascript">
// 说明：获取页面上选中的文字
// 整理：http://www.CodeBit.cn
function getSelectedText() {
if (window.getSelection) {
// This technique is the most likely to be standardized.
// getSelection() returns a Selection object, which we do not document.
return window.getSelection().toString();
}
else if (document.getSelection) {
// This is an older, simpler technique that returns a string
return document.getSelection();
}
else if (document.selection) {
// This is the IE-specific technique.
// We do not document the IE selection property or TextRange objects.
return document.selection.createRange().text;
}
}
</script>
在 FireFox 下获取 input 和 textarea 中选中文字的解决方案:
<script type="text/javascript">
// 说明：FireFox 下获取 input 或者 textarea 中选中的文字
// 整理：http://www.codebit.cn
function getTextFieldSelection(e) {
if (e.selectionStart != undefined && e.selectionEnd != undefined) {
var start = e.selectionStart;
var end = e.selectionEnd;
return e.value.substring(start, end);
}
else return ""; // Not supported on this browser
}
</script>
比较全面的一个：
参考：http://help.dottoro.com/ljtfkhio.php
<head>
<script type="text/javascript">
function GetSelectedText () {
var selText = "";
if (window.getSelection) { // Firefox, Opera, Google Chrome and Safari
if (document.activeElement &&
(document.activeElement.tagName.toLowerCase () == "textarea" ||
document.activeElement.tagName.toLowerCase () == "input"))
{
var text = document.activeElement.value;
selText = text.substring (document.activeElement.selectionStart,
document.activeElement.selectionEnd);
}
else {
var selRange = window.getSelection ();
selText = selRange.toString ();
}
}
else {
if (document.selection.createRange) { // Internet Explorer
var range = document.selection.createRange ();
selText = range.text;
}
}
if (selText !== "") {
alert (selText);
}
}
</script>
</head>
<body onmouseup="GetSelectedText ()">
Some text for selection.
<br /><br />
<textarea>Some text in a textarea element.</textarea>
<input type="text" value="Some text in an input field." size="40"/>
<br /><br />
Select some content on this page!
</body>
http://www.cn-cuckoo.com/2010/10/21/the-design-of-html5-2151.html
http://www.flyinghail.net/page/2/
http://www.cn-cuckoo.com/2010/10/21/the-design-of-html5-2151.html
http://www.35ui.cn/
天气预报嵌套地址：
http://www.265.com/weather/59493.htm
在Opera下，对于onkeydown的默认行为是不能用event.preventDefault()来取消,用opera下onkeypress却可以。
var cancelKeypress = false;
document.onkeydown = function(evt) {
evt = evt || window.event;
cancelKeypress = (evt.ctrlKey && evt.keyCode == 84);
if (cancelKeypress) {
return false;
}
};
/* For Opera */
document.onkeypress = function(evt) {
if (cancelKeypress) {
return false;
}
};
有时候ajax返回的html类型的data，通过$(data).find("#ddd"),居然找不到，测试了下先把data数据appendTo一个容器比如body后再去$(data).find("#ddd")就可以找的到了，jquery处理方式有点怪
ie6 边框透明的解决方案：
border:2px solid transparent;
_border-color:tomato;
_filter:chroma(color=tomato);
如果是表格的话则table的border-collapse属性不能为collapse才可以实现
参考：http://blog.csdn.net/doymm2008/archive/2010/03/05/5349467.aspx
透明PNG在IE6下的官方解决方案
http://blog.csdn.net/doymm2008/archive/2010/03/05/5349374.aspx
http://hi.baidu.com/iamzhangxinxu/blog/category/.net%D1%A7%CF%B0
鼠标位置
function mousePosition(ev){
if(ev.pageX || ev.pageY){
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
事件源
var e = arguments[0] || window.event;
var ele = e.target || e.srcElement;
http://www.web666.net/
http://jslover.com
ie6 fixed
.fixed{
position: fixed;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop));
}
html {
_background: url(xx.jpg) fixed;
}
http://www.planeart.cn/
简单的判断IE：if(-[1,]){//非IE}
返回毫秒数：
var a = +new Date();
http://jscrollpane.kelvinluck.com/
js学习：
http://blog.csdn.net/yangdengfeng2003/category/300597.aspx
http://wange.im/
http://www.cssshare.com/
http://www.94this.com.cn/
http://www.html-js.com/?p=1031
14个非常棒的 JavaScript 游戏开发框架推荐
http://www.cnblogs.com/lhb25/archive/2011/04/25/1965739.html
http://www.cnblogs.com/lhb25/
http://www.pigzz.com/jscode/
前端工程师blog:
http://hszy00232.blog.163.com/
再谈图片预加载：
http://www.planeart.cn/?p=1121
再谈IE6之fixed
http://www.planeart.cn/?p=877
good:
http://www.cnblogs.com/cloudgamer/
用JavaScript写出一个linux PC模拟器
http://bellard.org/jslinux/
https://github.com/
css3:
http://dotnet.aspx.cc/
http://missdora.net/blog/category/javascript/
transform可以对元素进行角度旋转和缩放,请使用webkit内核最新版浏览器浏览该文章以保证CSS3效果能够完全呈现
有五种变形样式，可以重叠多种变形样式，以空格分隔
scale:缩放，1为原始大小。scale(x)。正数放大，负数缩小。属性值为一个时，x/y轴同时缩放；属性值为两个值时，分别控制x、y轴的缩放。
rotate:水平旋转，属性值格式为Xdeg。rotate(Xdeg)。X为正数时，顺时针旋转；为负数时，逆时针旋转
translate:定位元素，基于XY轴重新定位元素。translate(Xpx,Ypx)。属性值为一个时，x、y轴参数相同；为两个时，x、y轴分别定位
skew:将元素沿水平方向倾斜变形。skew(Xdeg,Ydeg)。这个比较难表述，想象一下平行四边形吧。属性值为一个时，x、y轴参数相同；为两个时，x、y轴各自倾斜。
matrix:矩阵，六个值。矩阵变形（学习完毕之后更新）
浏览器支持情况:-webkit-transform,-moz-transform,-o-transform,目前对CSS3动画支持的最好最全面的是webkit内核浏览器。
在设置了transform属性后，可以设置transform-origin属性，这个属性控制变形时的源点，也就是变形时围绕的点。这个属性接受两个参数，可以是百分比、top/center/bottom、带单位的数值。
transition:transition-property transition-duration transition-timing-function transition-delay
transition-property:要实现动态转换的css属性名。可以设定为all,则动态转换所有改变的属性值，包括transform
transition-duration:设定转换的时间，单位s(秒)
transition-timing-function:过渡时的效果，可以想象下幻灯片切换时的效果。常用值：ease | linear | ease-in | ease-out | ease-in-out
transition-delay:动态转换产生的延迟时间。不常用
eg:
.color-transition{
color:red;font-size:18px;
-webkit-transition:color .5s linear;}
.color-transition:hover{
color:blue;}
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
http://www.cctry.com
http://www.xiaotai.com
.noBr
{
white-space:nowrap;
word-break:keep-all;
}
.wordBr
{
white-space:normal;
word-wrap:break-word;
}
.break
{
white-space:normal;
word-break:break-all;
}
http://hellohtml5.com/search/label/javascript
http://www.chinabyte.com/bang/html5/
function setCookie(name, value, expires, path, domain, secure){
var c = name + '=' + escape(value);
if(expires){
var d=new Date();
d.setTime(d.getTime()+expires*24*3600*1000);
c+='; Expires='+d.toGMTString();
}
c += ((path) ? '; path=' + path : '') +
((domain) ? '; domain=' + domain : '') +
((secure) ? '; secure' : '');
document.cookie = c;
}
function getCookie(name)
{
var a=document.cookie.split("; ");
name+="=";
for(var i=0;i<a.length;i++)
if(a[i].indexOf(name)==0)
return unescape(a[i].substr(name.length));
return '';
}
 
javascript api:
http://qefqei.com/javascript/
http://qefqei.com/jquery/
css3:
https://developer.mozilla.org/en/css/-moz-transform
http://www.css88.com/tool/css3Preview/
callee属性是arguments的一个属性，返回方法的正文。
即：func.arguments.callee = func;
利用callee属性可以轻松实现递归调用：
caller属性是方法的一个属性，返回当前调用该方法的方法。
如果在A方法中调用了B方法，在A方法执行的过程中，在B函数中存在B.caller等于A的方法体。
a:link|a:visited|a:hover|a:active
排序算法：
http://www.comp.nus.edu.sg/~xujia/mirror/algorithm.myrice.com/algorithm/commonalg/sort/index.htm#
writing-mode:tb-rl; (IE)
transform:rotate(90deg);
var documentFragment=document.createDocumentFragment();
diaplay:inline-block;
内联元素浏览器都支持；块级元素在IE6/7下面不支持，这时候加上*display:inline;*zoom:1;就可以了。
由于 inline 元素是可以自然地 vertical-align 的，因此将需要设定垂直居中的对象设定为 inline-block，同时引入一个冗余的兄弟元素同样设定为 inline-block，并且 height: 100%，再设定两者都为 vertical-align: middle。
eg:<div class="abc">
<div class="bcd">ddd</div>
<div class="h"></div>
</div>
.bcd
{
height:20px;
line-height:20px;
display:inline-block;
vertical-align:middle;
*display:inline;
*zoom:1;
}
.h
{
display:inline-block;
height:100%;
vertical-align:middle;
*display:inline;
*zoom:1;
}
typeof 运算符返回一个用来表示表达式的数据类型的字符串。
可能的字符串有："number"、"string"、"boolean"、"object"、"function" 和 "undefined"。
function createXmlHttpRequest(){
if(window.ActiveXObject){ //如果是IE6以及以下浏览器
return new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){
return new XMLHttpRequest();
}
}
xmlHttpRequest = createXmlHttpRequest();
xmlHttpRequest.onreadystatechange = fn;
xmlHttpRequest.open("get",url,true);
xmlHttpRequest.send(null);
canvas 特效：
http://hakim.se/experiments/html5/blob/04/
reset.css
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,canvas,video,audio
{
display:block;
}