Category Archives for html
[转帖]在同一站点下,跨子域进行ajax通信的一种解决方法
处于安全的考虑,浏览器对于ajax请求是有限定的,他要求发起和相应请求的双方处于相同的域名。 一种比较容易的方式就是在当前的域名下设置一个代理页面,通过它来发送请求和转接回复的数据,从而实现ajax的跨域请求。这种方式的优势在于可以跨站点而不仅限于跨子域,不过这样做还有一个弊端就是客户端的session信息将会丢失,在一些需要session的情形(比如需要用户登录验证的情况)就不能适用。 这里介绍的是另一种方法。 解决办法其实和上面的代理页面方式有些类似,上面的方式我们实际上是借用代理页面来发送请求和接受数据,从而绕开浏览器的安全设定。而在这里我们将借用代理页面所处的环境,通过它来实现功能。 首先在想要进行通信的那个子域下设置一个”代理”页面,在这个页面中我们是能对这个子域下的数据进行ajax请求的。 接着就是需要建立一个通道来使用”代理”页面的这一权限,我们在需要使用跨子域的页面中通过iframe引入代理页面,然后通过javascript就能获得代理页面的javascritp环境(iframeEle.contentWindow),不过这里有个前提就是代理页面需要和当前页面处于同一域中(document.domain需要一致)。由于对于document.domain的值设定时有一个规定就是,域只能提升,不能降低层级或者跳到同级中(比如 home.blueidea.com 只能设为blueidea.com 而不能设为 bbs.blueidea.com或者 xx.home.blueidea.com),所以这里可以在两个页面中同时把document.domain提升为站点的主域。 通过以上的实现,我们就可以在页面中调用想要进行通信的子域下的”代理”页面来进行ajax通讯了。 上面的图基本能解释的很清楚了,如果有疑问,可以查看原文, 原文来自 blueidea ——2011 年 12 月 27日—– ps: 英文原文 yahoo
ie6-7 的display:inline-block文字隐藏(text-indent:-xxxx)
一般纯背景图表示内容的时候,会放一些文字说明,有利于机器的阅读(有需要借助机器才能“阅读”的人,听说win7 自带就有屏幕阅读器) 但是有不想文字露出来,所以要把他们隐藏掉。 一般我们会使用 font-size:0; line-height:0; display:inline-block; text-indent:-99999px; ie6-7有bug,导致都显示不出来 IE 的 text-indent Bug和当inline-block与text-indent在IE6、7下相遇 上面得俩个文章基本能说明ie6-7下在display:inline or inline-block;得时候text-indent的bug; text-indent会传递父级。 <style type=”text/css”> a{ display:inline-block; margin-left:150px; width:150px; height:35px; text-indent:-9999em; background: red; } </style> <div><a>下一步</a></div> 上面的代码在ie6-7上看不到红色的背景 <style type=”text/css”> a{ display:inline-block; margin-left:150px; width:150px; height:35px; text-indent:-9999em; background: … Continue reading
导航头的100%背景 ,需要添加magin:0 auto;min-width:xxx
导航头的100%背景 ,需要添加magin:0 auto;min-width:xxx update:20101019 16:42 国内的大部分网站页面使用的宽度950px或者960px作为页面主要的宽度 其中有些头部的一小块的宽度是width:100%,带一个背景,随着页面自适应。 浏览器或者屏幕显示的区域小于950或者960px 浏览器的底部会滚动条,如图所示 滚动条拉到最右边的时候看页面width:100%部分的背景,有些时候显示不全 demo
form对象小陷阱
前段时间开发项目做好了demo给开发,demo是没有问题。 结果开发说页面的form怎么也提交不了。。。- -!!! <form id=”formId” action=”http://xxx.com” method=”post”> <input name=”username”> <input name=”submit” type=”submit”> </form> <script src=”http://k.kbcdn.com/global/utilities/utilities_1_4_8.js” ></script> <script> var _E = YAHOO.util.Event; _E.on(“formId”,”submit”,function(ev){ _E.stopEvent(ev); /* 处理乱七八糟的东西 */ this.submit(); //最后提交; }); </script> demo 上面的代码不能正常运行,firebug报this.submit is not a function 代码一比对发现 <input name=”submit” type=”submit”> … Continue reading
<sup> <sub> 和 yui reset
<sup>上标 vertical-align:super <sub>下标 vertical-align:sub Yui reset之后 <sup> vertical-align:text-top; <sub> vertical-align:text-bottom; opera 和chrome 下reset之后不是预期的效果。 还有chrome中文模式下字体最小是12px,丫丫的结果就是空出一大块。 ps:先写这么多,空了添加个demo。。。