clip属性,基本上dom对象都有这个属性,用来剪切对象的可见范围。
语法:
HTML | { clip : sClip } |
---|---|
Scripting | object.style.clip [ = sClip ] |
值:
sClip | 字符串值,如下两种类型:
|
以object的左上角为坐标原点,x轴向左,y轴向下,跟屏幕的坐标系方向一致,只是移动了原点。
在这个坐标系中,设置一个clip,这个clip的top,right,bottom,left 的位置由以上几个参数设置,在这个clip的范围之内才可以显示。之外的为透明。
注意:position的属性必须为absolute。
利用这个特性,可以做既可以写又可以选择的下拉框。
原理就似乎利用一个input和一个select,将二者重合,并且剪切select,只显示select的下拉按钮。
代码如下:
<select id="slt" name="slt" style="position:absolute; width:200px; left:50px; clip:rect(0px 200px 25px 180px)" οnchange="document.getElementById('txt').value=this.options[this.selectedIndex].text;">
<option value="0" selected="selected"></option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="text" id="txt" style="left:50px; width:190px; position:absolute;" />