div类:悬停在IE中无法正常工作 [英] Div class :hover not working properly in IE
本文介绍了div类:悬停在IE中无法正常工作的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
请使用Internet Explorer查看下面的链接
Please take a look at the link below using Internet Explorer
http://mojogobbles.com.sg/cupcake-menu/
似乎当我尝试将鼠标悬停在已声明的div类上时，:hover 不能正常工作，但是在chrome中，它可以正常工作.知道为什么吗?
It seems that when i try to hover over a declared div class, the :hover does not work properly, but in chrome it works perfectly. Any idea why?
请仅提供CSS解决方案！
CSS solutions only please!
这是CSS编码
#f12{
width: 400px;
height: 30px;
left: 470px;
top: 1090px;
position: absolute;
background: transparent;
opacity: 1;
filter: alpha(opacity=0);
float: left;
border-width: 1px;
border-style: inset;
z-index: 99999;
}
#f12:hover ~ #floater{
background:url(images/flavours/f12.jpg);
width: 320px;
height: 320px;
opacity: 100;
top: 30%;
left: 0%;
filter: alpha(opacity=100);
float: left;
position: fixed;
}
#f13{
width: 100px;
height: 50px;
left: 550px;
top: 460px;
position: absolute;
background: transparent;
opacity: 1;
filter: alpha(opacity=0);
float: left;
-webkit-transition: 1s all;
-moz-transition: 1s all;
transition: 1s all;
border-width: 1px;
border-style: inset;
}
#f13:hover ~ #floater{
background: url(images/flavours/f12.jpg);
opacity: 100;
}
#floater{
width: 320px;
height:320px;
opacity: 0;
position: fixed;
left: 0;
top: 30%;
filter: alpha(opacity=0);
float: left;
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
border-width: 1px;
border-style: inset;
filter: alpha(opacity=100);
}
推荐答案
您有两种doctype，第一种将IE置于怪癖模式是错误的.只需删除它们两个并使用以下一个:<！DOCTYPE html>
You have two doctypes and the first one is wrong putting IE into quirks mode. Just delete both of them and use this one: <!DOCTYPE html>
这篇关于div类:悬停在IE中无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
