判断A节点是否包含B节点

发现实际项目中经常需要判断一个节点是否是另一个节点的子节点,google了一下以及在做富文本的时候顺便看了下mozilla的api文档,发现个compareDocumentPosition方法,可用来比较两个节点位置。ie则有更好用的方法contains,只要传入的节点是其子孙节点就返回true。 more

compareDocumentPosition的返回值的说明如下(来自杂之学):

/*

* compareDocumentPosition: 属于 DOM Level 3 Core

* referrer: http://www.w3.org/TR/DOM-Level-3-Cor......

动态获取图片宽高

由于网站服务器在国外,国内访问有点慢

加上家里这烂鬼长城宽带,打开页面时如果有图片,加载时间相当久

于是决定改为先拉小图片,点击之后再异步拉取大图

原理是点击小图的时候创建一个img标签,设置onload事件,

在大图加载成功时显示大图more

但是这里面的img标签不能用document.crearteElement('img')的形式创建

这样创建的image在onload完成时,读取到的width/height是0

如果用 new Image()的方式就可以读取宽高,郁闷的image

关键代码如下:

va......

svn服务器端和客户端的安装

svn有什么用我就不说了

安装svn服务很简单,基本上都是绿色免安装的,我用的svn服务器端我也忘记在哪下的,不过重装系统后重新注册一下服务就可以用了。

方法如下: 先点击这里或到官方网站选一个svn的服务器程序下载,解压到一个文件夹

and then找个用来放svn数据库的文件夹,打开cmd,输入

D:\svn-win32-1.5.6\bin\svnadmin create E:\MySvnData

创建svn数据库所需要的文件,之后输入

sc create subversion_service binPath= "D:\svn-win32-1.5......

http与https协议的跨域的解决方案

最近在做一个功能,把gmail嵌入自己的网站,本来也不是什么大问题,但是老大要求使用https协议来保证账户和密码的安全

好不容易等到安全证书审批下来,后台的搭了一个tomcat服务器,打开https就准备开工了,结果遇上该死的跨域问题

本来跨域也不难解决,不论是子域跨域(one.aaa.com 到 two.aaa.com的跨域) 或者网站跨域(www.aaa.com到www.bbb.com)都可以用jsonp或者iframe解决

令人奔溃的的是浏览器对于域名一样,协议或端口不同的网站都认为是跨域

jsonp只能使用get的方式,要保证安全,只能用post方式

......

【魅力CSS】使用CSS3的Linear Gradients (线性渐变)制作渐变背景按钮

该方法用到主要特性是 gradient

gradient只有ff和webkit内核的浏览器有支持,不过目前都还是私有的,不知道何时才能标准化

在ff和webkit的调用方式都还不一样,具体可以看这里和这里,说明的很清楚了

ie可以用滤镜达到效果,一如既往的无视它

来看看效果先:

more

用到的主要代码如下:

完整的demo请点击这里

【魅力CSS】用CSS3的transform垂直排列日期

废话少说,先上图:

当然了,transform属性目前的ie不支持,但那不关我事。

传说也可以用滤镜解决,具体办法到google搜"css 垂直排列日期"就有了。more

rotate是一个使目标旋转的属性,属性值从-180到180都行,可以认为是试一个点绕着圆心转,不过转360也没意义。

目前支持的浏览器有Ff、webkit内核、以及opera

原理很简单,将日期按照"月/日/年"的顺序上下排列,然后旋转年份-90度,再通过translate属性进行位移定位

主要代码如下,demo请点击这里:

博客改版与CSS3主题

工作了一段时间了,总算有点私人时间玩玩博客

近期开始用css3对博客进行改版和优化博客文章

ie? I don't care that bitch

php不熟,先把大体搞好,其他的就慢慢来了

因为经常受到垃圾评论的骚扰,暂时不开发评论功能

iframe的可编辑状态消失的问题

在ie下同一页面有多个可编辑的iframe

把其中任何一个从Dom树移除的话

会导致其他iframe的可编辑状态消失

只要对剩下的iframe中的任一个的document.body调用一下focus即可解决

【魅力CSS】纯CSS多级菜单

下午在看《ajax权威指南》,看了多级菜单部分,想了想,觉得可以用纯CSS做一个。

用了CSS2的子对象选择符“>”和伪类“hover”,可以IE6不支持子对象选择符,除A之外的标签页不支持hover,所以无视IE6,咱们做web前端的已经被IE6害的够惨的了。

兜远了……直接上图,想要多少级就多少级。

more

demo请点击这里 , CSS代码如下:

关于reset.css的必要性

通常开始写css的时候,我都会先link一个reset.css。

所谓reset,就是将html标签的样式都去掉,变成普通的标签的样子如。

要reset的根本原因就是不同的浏览器对同一个标签样式的解析不一致,导致有些css在一个浏览器显示明明没问题,可是到了另一个浏览器则产生多多少少的错位等问题。加入了reset,就要对很多样式重写,即使你想让他保持原来的样子。

但是对于用户产生内容的网站来说,比如Blog,都用到了富文本可视化编辑器,而大部分编辑器都使用了execCommand来实现格式化的。execCommand在不同的浏览器会生成不同的代码,如“粗体”,执行exe......

Tags

css3   魅力CSS   nodejs   loading   CSS   疯狂的菊花   html5   animation   compiler   编译脚本   png   WordPress   智能   旅行   优化   模板   历史记录   跨域   manifest   frame   canvas   动画   js   离线应用   codelet   transform   抽取   java   兼容问题   发布脚本   富文本   那一年在他乡   htaccess   iframe   帧动画   加载速度   intelligent   跨浏览器   DNS解析   插件   checkbox   单边   step-start   vary   复选框   自动更新   转换   文本溢出   盒子阴影   menu   blob   西安   滑动背景   box-shadow   内存占用   键盘事件   python   auto   text overflow   background   所见所得   android   rotate   字节数   合并   文本框   slide   字符串连接符   协议   伪类   兄弟选择符   网格   节点位置比较   空白   斜线拼接   自定义命令   溢出   clock   素描   无法更新   分隔符   字符编码   body   下载文件   精灵图   step   nodej   ubuntu   apache   css3选择器   创建文件   多级菜单   编辑状态   ajax   阴影   垂直   chrome   管道   时钟   firefox   背景   文件上传   createobjecturl   游记   下载   放射渐变   版本号   宽高   照片   localStorage   渐变背景   图片   图片拼接   属性值检测   自动生成   计算   返回键   oauth   合图   reset   调用   cavnas   漏洞   按钮   margin   线性渐变   xsrf   被黑   tab   checked   修复   border   消失   step-end   sprite   common-upload   菜单   兄弟选择器   字符串   svn   九寨沟   缩进   css遮罩   svg   添加系统服务   gzip   插入代码   动态   加速   模拟