开发基于Safari网站的一点心得（１）

最近将一个只支持IE浏览器的WEB应用程序搬到Safari下，没修改之前，打开一看页面很乱，根本就无从下手。用div ul li 等布局的表格和在IE下的效果完全不一样，在IE下每一个LI都是独立的一行，而现在所有的LI都挤到一行，原因是在IE下LI的样式里加了，将下面的改掉就OK了。

IE

Float: left;

Safari

Clear: both;  /* 打断LI */

input标签的值改变时触发的事件在IE下是onpropertychange而在Safari和Firefox下是oninput事件

<input id="myup" type="file" oninput="check()" value="111">

 

将tr交换变换背景色

在IE中CSS支持expression方法，而FF和Safari都不支持，找了很久也没找到适合的解决办法，最后只能用JS来实现，但是要保证JS被执行时table已经被页面加载。

IE

CSS

tr{
    PADDING-TOP: 10px;
    BACKGROUND-COLOR: expression(rowIndex%2==1?'#CCCCCC':'')
}

Safari

JS

<script language="JavaScript">
objName = document.getElementById("tab1").getElementsByTagName("tr");
for (var i = 0; i < objName.length; i++){
    (i%2==0)?(objName(i).className = "li01"):(objName(i).className = "li02");   
}
</script>

CSS

.li01 {
background: #fff;
}

.li02 {
background: #CCCCCC;
}

将鼠标变为小手

IE CSS

cursor:hand;

Safari CSS

cursor:pointer;  /* 这个设置三大浏览器都支持 */

先写这些吧