一直以来我都以为css是无法限制字符长度的,最近才发现原来可以这样.最简单的兼容方法:
.textOverflow {
width:100px;
white-space:nowrap;/*限制单行输出*/
text-overflow:ellipsis;/*只支持IE6(+)*/
overflow: hidden;
-o-text-overflow: ellipsis;/*Opera专用*/
-moz-binding: url('ov.xml#ellipsis');/*firefox下实现要配套对应的xml文件*/
}
/*.xul是为<xul:description>添加的class属性*/
.xul{
color:#fff;
}
html代码:
<div class="textOverflow">块级元素块级元素块级元素块级元素块级元素块级元素</div>
根目录下ov.xml文件代码:
<?xml version="1.0" encoding="utf-8"?>
<bindings
xmlns="http://www.mozilla.org/xbl"
xmlns:xbl="http://www.mozilla.org/xbl"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
>
<binding id="ellipsis">
<content>
<xul:description class="xul" crop="end" xbl:inherits="value=xbl:text"><children/></xul:description>
</content>
</binding>
</bindings>
现在网上很多是流行js方法来兼容ff的,其实上述介绍的是用了xul:description的方法,^_^我也不知道那是啥来的,不过这样写很简洁。
关于xul的教程《XUL教程》
转载请注明:作者Joe 地址:http://xiebiji.com/2008/11/textoverflow
Posted in css |
62 views| 2 Comments »
mootool这个类oo型的S框架果然强大!其中的function类有一个方法叫bind,这东西太方便了!怎样方便,请看以下代码:
HTML代码:
<div id="element">mootool要变我颜色了!</div>
JS代码:
var e=$('element');
function ChangeColor(){
this.setStyle('background','red');
}
var ChangeColorBind=ChangeColor.bind(e);//这样ChangeColor函数里面的this就被e元素替换了!
ChangeColorBind();
也许这里你还没看见这个有多方便方便,但是涉及到嵌套函数的时候你就知道它有多强大了!
Posted in mootools |
121 views| 2 Comments »
汗!下面的一句字符串,居然直接生成一个png图片
data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAADAFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACzMPSIAAABAHRSTlNNAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAhTh5BAAAAA1JREFUeAEBAgD9/wAAAAIAAX4FDdIAAAAASUVORK5CYII=
Posted in HTML |
85 views| 4 Comments »
天马行空!!先把这个记下先!
在CSS布局中,还常常用到IE Hack。if IE起着非常大的作用!
if IE什么意思呢?下面就列举了一些在CSS常见的HACK控制语句。
作为IE的IF条件注释使用备忘,有些时候试用if IE而不是在css中使用hack,就能通过w3c验证。
<!--[if !IE]>除IE外都可识别<![endif]-->
<!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 5.0]> 只有IE5.0可以识别 <![endif]-->
<!--[if IE 5]> 仅IE5.0与IE5.5可以识别 <![endif]-->
<!--[if gt IE 5.0]> IE5.0以及IE5.0以上版本都可以识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
Posted in HTML, css |
82 views| 2 Comments »

看来我的JS(MT)确实不行啊,写了一个下午才有那么点特效,这个是前阵子接来做的网页,只收了200块。一点点钱也好啦。高手就瞄一下就好啦~非常欢迎提供的意见。以下是橙色跟蓝色的不同测试地址:
蓝色版:http://xiebiji.com/works/eshop
橙色版:http://xiebiji.com/works/eshop-orange
特效是用mootool写的,flash是JS交互的。客户最终选择了蓝色版,我自己比较喜欢橙色版,很久以前问某个女同学她说她喜欢橙色,于是我就以橙色色调做的^_^!蓝色版是以橙色版为基础改过来的。
有时当一下网络民工也不错^_^!
PS.真的很希望IE6快点灭亡,下午就是一个css兼容问题搞了两个小时的!!!
Posted in 原创作品 |
317 views| 8 Comments »