从JavaScript脚本支持看IE10

来源：互联网发布：java ping ip 端口编辑：程序博客网时间：2024/06/06 15:49

关于IE10对JavaScript的支持

最近学习JavaScript脚本程序，用IE10跑JavaScript脚本，每次IE都拦截，点了以后才可能出现预期的效果。在Internet选项改了以后，还是拦截，不明白！而且每次都要重启电脑，很麻烦！

IE10对CSS和JavaScript支持的不够好，如下所示：

当鼠标移动到“基础信息”标签后，效果如下：

当鼠标离开“基础信息”标签后，效果如下：

当鼠标移动到“往来管理”标签后，效果如下：

在搜狗浏览器的效果如下：

在火狐浏览器的效果如下：

在Chrome浏览器的效果如下：

自身感觉每次想在地址栏输入某个网址，就感觉空间太小，令人不舒服。本人常用搜狗浏览器，一方面是它把地址栏与打开的窗口分开，这样留给地址栏足够大的空间。二是它有用户名和密码记录功能，不要每次都输入用户名和密码。如今无论是哪个应用论坛、贴吧、网站，都有注册用户功能，这样势必要记住用户名和密码。如此这样，省去不少麻烦。

前进按钮几乎用不到，没必要在那占地方, 个人认为应该取消这个按钮。

再来看个例子，同样的网页代码在IE上却出现不一样的情况。主要代码如下：

<style>

body

{

background-color:#9BD5BF;

font-size:12px;

font-family:Arial, Helvetical, sans-serif;

margin:0px;

padding:0px;

color:white;

}

ul, li

{

margin:0px;

padding:0px;

}

{

display:inline;

list-style:none;

list-style-position:outside;

text-align:center;

font-weight:bold;

float:left;

}

a:link

{

color:#336601;

text-decoration:none;

float:left;

width:100px;

padding:3px 5px 0px 5px;

}

a:visited

{

color:#336601;

text-decoration:none;

float:left;

width:100px;

padding:3px 5px 0px 5px;

}

a:hover

{

color:white;

float:left;

padding:3px 3px 0px 20px;

width:88px;

text-decoration:none;

background-color:#539D26;

}

a:active

{

color:white;

float:left;

padding:3px 3px 0px 20px;

width:88px;

text-decoration:none;

background-color:#539D26;

}

#nav

{

width:600px;

height:30px;

border-bottom:0px;

pading:0px 5px;

position:absolute;

z-index:1;

left:198px;

top:25px;

}

.list

{

line-height:20px;

text-align:left;

padding:4px;

font-weight:normal;

}

.menul

{

width:120px;

height:auto;

margin:6px 4px 0px 0px;

border:1px solid #9CDD75;

background-color:#F1FBEC;

color:#336601;

padding:6px 0px 0px 0px;

cursor:hand;

overflow-y:hidden;

filter:Alpha(opacity=30);

-moz-opacity:0.7;

}

.menu2

{

width:120px;

height:18px;

margin:6px 4px 0px 0xp;

background-color:#F5F5F5;

color:#999999;

border:1px solid #EEE8DD;

padding:6px 0px 0px 0px;

overflow-y:hidden;

cursor:hand;

}

</style>

</head>

<body>

<ul>

<li class="menu2" onMouseOver="this.className='menu1'"

onMouseOut="this.className='menu2'">

设置

<a href="#">我的Png</a><br>

<a href="#">我的Gif</a><br>

</div>

</li>

<li class="menu2" onMouseOver="this.className='menu1'"

onMouseOut="this.className='menu2'">风格

<a href="#">我的CHINAY</a><br>

</div>

</li>

<li class="menu2" onMouseOver="this.className='menu1'"

onMouseOut="this.className='menu2'">

提醒

<a href="#">我的CHINAY</a><br>

</div>

</li>

<li class="menu2" onMouseOver="this.className='menu1'"

onMouseOut="this.className='menu2'">查询

<a href="#">我的CHINAY</a><br>

</div>

</li>

</ul>

</div>

在IE10的效果如下：

在搜狗浏览器的效果如下：

在火狐浏览器的效果如下：

在谷歌浏览器的效果如下：