- 博客(33)
- 资源 (15)
- 收藏
- 关注
原创 不用JS实现显示隐藏效果(兼容各浏览器)
先上图,公司的机票软件项目中有很多显示隐藏效果,以前都用JS实现的,因为在IE6下:hover不起作用,但觉得太浪费资源这次拿CSS实现了,且兼容各种浏览器HTML:¥1596 税费机建:¥50燃油:¥50对应的CSS.yutable a.gray:hover{ position:relative;}.price{ display:none; }.yu
2013-01-07 09:54:34
971
原创 关于line-height,font-size等
原来我一直以为文字上下间距为4px;今天在看某公司设计规范,发现很纳闷,于是动手试了下*{ padding:0; margin:0; font-size:12px;}ul li{ list-style:none; line-height:16px; height:16px; background:#f60}测试测试测试测试测试测试ASDDJOGFadfkds
2013-01-07 09:53:38
340
原创 设计中的五行
公司老总讲风水,在LOGO设计的时候,不得不套用下五行原理,经过“教导”,特将规律总结如下,希望对设计人员有用(前提是你也遇上一个懂风水并深信的老总或客户)何谓五行:木,火,土,金,水 之合称。 木旺于春,色青。 火旺于夏,色红。 金旺于秋,色白。 水旺于冬,色黑。 中央均属土,色黄。 五行相生:水生木,木生火,火生土,土生金,金生水
2013-01-07 09:51:32
1558
原创 iframe高度自动适应宽高的js (兼容FF)
在机票版本中应用了iframe,但FF对iframe的高度解析有问题,因此调用以下JSfunction SetCwinHeight(){var xunzou=document.getElementById(“xunzou”); //iframe idif (document.getElementById){if (xunzou && !window.opera){if (xunzou.co
2013-01-07 09:50:37
403
转载 css和javascript在IE和Firefox中二十三个不同点
PS: 一年多前,我半懂不懂地读完了以下这篇文章,今天重新翻出来看。发现在1年多的工作中我已经遇上了以下问题中的18个,希望初学JS和CSS的朋友能好好琢磨一下。我们讨论的主题CSS网页布局,最令大家头疼的问题就是浏览器兼容性,虽然52CSS.com介绍过很多这方向的知识,但依然让很多开发人员晕头转向,今天的这篇文章,将列出css和javascript在IE和Firefox中二十三个不同点,希望对
2013-01-07 09:49:51
272
原创 兼容各种浏览器的图片反转
效果如图CSS如下*{ padding:0; margin:0; font-size:12px;}a.more{ height:20px; line-height:20px; display:inline ; padding-right:10px; position:relative ; width:62px; float:left; font-size:15px;}a.
2013-01-07 09:49:01
512
转载 高效 CSS 书写规则
以下文档描述了应用在 Mozilla UI 中优化 CSS 文件的规则。第一部分是对于 Mozilla 样式系统分类规则的一般性讨论。在了解这个系统的基础上,后续部分包含了一些指南,书写可以利用这个样式系统实践优点的样式的指南。样式系统如何分类规则样式系统把规则分为四大类。理解这些类是很重要的,因为对于规则的匹配来说他们是首先要考虑的。之后的段落中会使用“主选择符”这个说法。主选择
2013-01-07 09:46:23
384
原创 颜色检测工具
很多时候,设计师希望要求我们完全还原设计图,甚至是要求“像素完美”。颜色是设计中很重要的一部分,你也会将设计图中的色彩完整的还原到页面中。然而,很多时候可能就连设计师自己都不知道用了多少种颜色。显然,页面中使用过多的颜色并不是好事。CSS Prism是一个专门用于查看和编辑CSS中用到的颜色的网站,它由Ryan Berg基于Django项目构建,采用 jQuery及其 ColorP
2013-01-07 09:45:16
397
原创 强大的table
相信有很多人不能够正确认识table,其实table是所有标签里比较复杂的一个,下边的两个属性可能大多数人都不太知道,废话不多说,看下边的小例子吧!COL 元素可嵌入于 COLGROUP 元素内。如果是这样的话,嵌套的 COL 属性将覆盖 COLGROUP 属性。你可使用元素 COL 和 COLGROUP 用于类似的目的。但是,你必须使用 COLGROUP 元素来决定表格内部分隔线
2013-01-07 09:42:42
230
原创 CSS文字竖排
实现网页文字竖排的方法有很多,先来看看CSS 样式表中提供的两种文字竖排的方法:writing-mode (IE5.5+专有属性)语法:writing-mode : lr-tb | tb-rl参数:lr-tb : 左-右,上-下tb-rl : 上-下,右-左另一种是用:layout-flow (IE5.5+专有属性)语法:layo
2013-01-07 09:42:15
367
原创 CSS2.0中的clip
今天看见群里有人讨论CSS的“CLIP”,因为自己从来没用过,误以为是CSS3.0里的属性,其实这个是2.0里的属性。记录一下用法。剪辑 (clip) 属性就像一个面具。它允许你使用矩形掩盖页面元素的内容。要剪辑一个元素:你必须指定其 position 属性为 absolute,然后指定相对于元素的 top,right,bottom,left 值。
2013-01-07 09:41:21
283
原创 IE8下input位移问题
最近接触的项目是软件的内嵌页面,编码方式UTF-8;在IE8浏览器下 姓名:这个INPUT中输入中文,整个INPUT输入框会向上偏移1PX,用户在输入过程中会感觉明显的抖动。我尝试给INPUT写了height,line-height,给外容器写了margin:0;padding:0都不起作用。最后的解决方案:1、将编码改为GBK或GB2312,这个方法在此项目中行不通2、将INPUT进
2013-01-07 09:37:08
1109
原创 事件监听中的问题
看到zhenn在BLOG里提到的一个关于监听中THIS的问题,感觉很好,一般我们的监听解决方案如下:function bindEvent(elem,type,fn){ if(elem.attachEvent){ elem.attachEvent(“on”+type,fn); }else{ elem.addEventLi
2013-01-06 14:53:33
247
原创 关于弹层引起的内存泄漏
当同事告诉我我们产品的弹出层每弹出一次会吃掉4M的内存,很震惊,我重来没关注JS性能这方面的东西。于是去查询了微软官方的资料,说得比较简单:在IE下的JS编程中,以下的编程方式都会造成即使关闭IE也无法释放内存的问题,下面分类给出:1、给DOM对象添加的属性是一个对象的引用。范例:var MyObject = {};document.getElementById(‘myDiv’).
2013-01-06 14:52:33
619
1
原创 让Pre标签内的文字自动换行
pre {white-space: pre-wrap; /* css-3 */white-space: -moz-pre-wrap; /* Mozilla, since 1999 */white-space: -pre-wrap; /* Opera 4-6 */white-space: -o-pre-wrap; /* Opera 7 */word-wrap: break-wor
2013-01-06 14:51:45
471
原创 关于改变网页滚动条颜色
最近在公司的一个软件内嵌页面项目中,因设计需求需要改变滚动条的颜色,我引用了按照原来同事写的CSS,心想BODY是统一定义的,因为可以直接实现效果,可惜页面没反应。对比文件后发现原来他去掉了,于是硬着头皮将直接页面的什么拿掉,结果IE那个该死的盒子模型开始作祟(w3c 盒子模型的范围包括 margin、border、padding、content,并且 content 部分不包含其他部分;
2013-01-06 14:51:15
502
原创 推荐两款编辑器
1、tinymce http://tinymce.moxiecode.com/examples/full.php 功能强大,感觉像Word,支持各类格式,但性能不怎么的,而且默认是英文版的。2、kindeditor http://www.kindsoft.net/ KindEditor是一套开源的HTML可视化编辑器,快速:体积小,加载速度快,您可以选择最合适你的模式
2013-01-06 14:49:21
289
原创 关于资源站项目小结
这个项目是一个游戏和软件下载的资源站,页面层级比较简单,主要是首页,列表页面,详情页面,排行榜页面,出错页面等。CSS: 1、很勤快的做了CSS Sprite,将有关图片做了拼合减少HTTP request请求。 2、关于CSS RESET,正好最近看了淘宝的新框架KISSY,比较了下觉得它的效率比较高,自己原来用的那套有冗余,譬如对DIV进行了{margin:0;p
2013-01-06 14:49:01
418
原创 自由变量记录
var name=”the window”;var obj={name:”my obj”,getNameFunc:function(){return function(){return this.name}}}alert(obj.getNameFunc())//the windowvar name=”the window”;var obj={na
2013-01-06 14:48:22
333
原创 关于比较符合语义的新闻列表
今天和公司前端MM讨论新闻的写法,想到很久以前的一个讨论结果,翻出来记录一下。http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>http://www.w3.org/1999/xhtml“>关于新闻的写法*{ padding:0; margin:0; font-size:12px; line-height
2013-01-06 14:47:39
193
原创 base.css
/* * base css * author YXQ * time 2010-11-11 *//*css RESET */body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; p
2013-01-06 14:47:11
268
原创 JS性能(1)
今天有个菜单列表要点击后加个状态,写了2段JS用FF进行性能分析方法一:var myclick;$(".colsidebox2 ul li").each(function(i){ $(this).click(function(){ if(myclick){ $(".colsidebox2 ul li").eq(myclick).removeClass("on");} va
2013-01-06 14:46:03
179
原创 变态IE6之奇数BUG
今天做一个项目中要用到圆角自适应容器,写了如下布局demo/*box*/.circbox{border:1px solid #E4E5EA; margin:10px; position:relative}.circbox b{background: url(style/img/bg_box.png) no-repeat; display:bloc
2013-01-06 14:44:25
340
转载 字体对照表
中文名 英文名 UnicodeMac OS华文细黑 STHeiti Light [STXihei] \534E\6587\7EC6\9ED1华文黑体 STHeiti \534E\6587\9ED1\4F53华文楷体 STKaiti \534E\6587\6977\4F53华文宋体 STSong \534E\6587
2013-01-06 14:43:42
524
原创 JS性能(2)
我们经常会在for循环中迭代一些数组元素或者一些HTML元素。for (var i = 0; i 技巧一:假如能将myarray.length存成maxfor (var i = 0, max = myarray.length; i afari下面提高两倍的速度,在IE7下面提高190倍的速度。技巧二:定义数组的时候,用 var myarr=[];代替 var
2013-01-06 14:43:14
254
原创 仿淘宝的结构新改的星星打分
重新改版后,利用绝对定位重叠每个星星的标签,又因为宽度不同,可以划到每个星星,这样只需要拼合2张图片对应的HTML对此应用评分 8分 1 2 3 4 5
2013-01-06 14:42:25
733
原创 JAVASCRIPT 模式
将最近阅读的《javascript设计模式》做下记录,以下是最新接触的一些设计模式。源码:http://www.jsdesignpatterns.com/ http://www.apress.com/1、工厂模式:有助于消除那些彼此实例化对方的类之间的耦合,并用1个方法来确定要实例化哪个类。例子:RSS阅读器2、桥接模式:把两个对象链接起来,实际就是一个门面类。3、组合模式
2013-01-06 14:40:15
261
原创 读《HTML、CSS和JAVASCRIPT开发Android》的笔记
这边书前4章都是我熟悉的内容,将重点做个记录。1、编辑器,推荐试用NOTEPAD++;2、样式表:3、控制页面缩放: 第五章:数据存储localStorage sessionFtoragelocalStorage.setItem('age',40)//设值localStorage.getItem('age')//读取localStorage.remo
2013-01-06 14:32:41
302
原创 网页特殊字体处理方案
.TTF或.OTF,适用于Firefox 3.5、Safari、Opera.EOT,适用于Internet Explorer 4.0+.SVG,适用于Chrome、IPhone@font-face {font-family: ‘fontNameRegular’;src: url(‘fontName.eot’);src: local(‘fontName Regular’)
2013-01-06 14:30:24
499
JQ弹窗教程,附DEMO
2011-05-16
兼容FF,IE等浏览器的弹出层教程
2011-05-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人