关于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;
}
li
{
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>
<div id="nav">
<ul>
<li class="menu2" onMouseOver="this.className='menu1'"
onMouseOut="this.className='menu2'">
设置
<div class="list">
<a href="#">我的Png</a><br>
<a href="#">我的Gif</a><br>
<a href="#">我的酷站</a><br>
<a href="#">我的日志</a><br>
<a href="#">我的相册</a><br>
<a href="#">我的收藏</a><br>
</div>
</li>
<li class="menu2" onMouseOver="this.className='menu1'"
onMouseOut="this.className='menu2'">风格
<div class="list">
<a href="#">我的CHINAY</a><br>
<a href="#">我的首页</a><br>
<a href="#">我的日志</a><br>
<a href="#">我的相册</a><br>
<a href="#">我的收藏</a><br>
</div>
</li>
<li class="menu2" onMouseOver="this.className='menu1'"
onMouseOut="this.className='menu2'">
提醒
<div class="list">
<a href="#">我的CHINAY</a><br>
<a href="#">我的相册</a><br>
<a href="#">我的收藏</a><br>
</div>
</li>
<li class="menu2" onMouseOver="this.className='menu1'"
onMouseOut="this.className='menu2'">查询
<div class="list">
<a href="#">我的CHINAY</a><br>
<a href="#">我的CHINAY</a><br>
<a href="#">我的CHINAY</a><br>
<a href="#">我的CHINAY</a><br>
<a href="#">我的CHINAY</a><br>
<a href="#">我的CHINAY</a><br>
</div>
</li>
</ul>
</div>
在IE10的效果如下:
在搜狗浏览器的效果如下:
在火狐浏览器的效果如下:
在谷歌浏览器的效果如下: