由于 img 行为标签导致多个 HTTP 请求
我们在 Websphere Portal Server 上部署了几个 portlet。在 css 文件中,我们包含了 img 标签的行为属性。
img {
position:relative;
border:none;
outline:none;
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true) );
}
我们已经发现这个行为标记会导致多个 HTTP 请求。在其中一个 Portlet JSP 中,我们包含了一个样式类,如下所示。
<link rel="stylesheet" type="text/css" title="Style"
href=''<%=request.getContextPath()+"/theme/stylesheet.css" %>'>
只有当我们有 request.getContextPath() 时,问题才会出现。如果我用实际的上下文根替换它,就不会出现问题。有人可以告诉我为什么该行为属性会导致问题吗?
We have couple of portlets deployed on Websphere Portal Server. In the css file we have included a behavior attribute for img tag.
img {
position:relative;
border:none;
outline:none;
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true) );
}
We have figured out that this behavior tag is resulting in multiple HTTP requests.In one of the Portlet JSP, we have included a style class as follows
<link rel="stylesheet" type="text/css" title="Style"
href=''<%=request.getContextPath()+"/theme/stylesheet.css" %>'>
The issue is there only when we have that request.getContextPath(). If I substitute that with the actual context root, it is not giving the problem. Can someone please let me know why that behavior attribute is causing the problem?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
雅虎!有一篇文章的标题是加速网站速度的最佳实践。要避免的一件事是 CSS 中的表达式,因为只需移动鼠标或滚动页面,它们的计算频率就比预期要高一些。
可以在此处阅读该文章并查找标题“避免 CSS 表达式”:
http://developer.yahoo.com/performance/rules.html
Yahoo! has an article with the title Best Practices for Speeding Up Your Web Site. One thing that is to be avoided is expressions in CSS as they are evaluated a bit more often than expected, just by moving the mouse or scrolling the page.
The article can be read here and look for the heading Avoid CSS Expressions:
http://developer.yahoo.com/performance/rules.html