用于Internet Explorer的带下拉菜单的jQuery_Jquery_Html_Css_Internet Explorer_Internet Explorer 8

用于Internet Explorer的带下拉菜单的jQuery

jquery html css internet-explorer internet-explorer-8

用于Internet Explorer的带下拉菜单的jQuery,jquery,html,css,internet-explorer,internet-explorer-8,Jquery,Html,Css,Internet Explorer,Internet Explorer 8,我正在使用jQuery1.10创建一个基本的下拉菜单。它在IE8上不起作用。我怎样才能解决这个问题 jQuery $(document).ready(function(){ $(".urun").hover(function(){ $("ul").slideDown(250); $("ul").mouseleave(function(){ $("ul").slideUp(200); }); }); });

我正在使用jQuery1.10创建一个基本的下拉菜单。它在IE8上不起作用。我怎样才能解决这个问题

jQuery

$(document).ready(function(){
    $(".urun").hover(function(){
        $("ul").slideDown(250);
        $("ul").mouseleave(function(){
            $("ul").slideUp(200);
        });
    });
});

HTML

<img src="http://blog.moovweb.com/wp-content/uploads/2013/04/stackoverflow-logo.png" alt="" class="urun"/>
<ul>
    <li><a href="#">123</a></li>
    <li><a href="#">321</a></li>
    <li><a href="#">213</a></li>
    <li><a href="#">312</a></li>
    <li><a href="#">331</a></li>
</ul>

试试这个

<html xmlns="http://www.w3.org/1999/xhtml">
<head >
    <title></title>
    <style type="text/css">
        .urun
        {
            width: 200px;
        }
        ul
        {
            list-style: none;
            display: none;
        }
        ul li
        {
            padding: 5px;
            width: 150px;
        }
        ul li:hover
        {
            background: #777;
        }
    </style>
    <script src="Scripts/jquery-1.10.1.min.js" type="text/javascript"></script>
</head>
<body>
    <img src="http://blog.moovweb.com/wp-content/uploads/2013/04/stackoverflow-logo.png"
        alt="" class="urun" />
    <ul>
        <li><a href="#">123</a></li>
        <li><a href="#">321</a></li>
        <li><a href="#">213</a></li>
        <li><a href="#">312</a></li>
        <li><a href="#">331</a></li>
    </ul>
    <script type="text/javascript">

        $(document).ready(function () {
            $(".urun").hover(function () {
                $("ul").slideDown(250);
                $("ul").mouseleave(function () {
                    $("ul").slideUp(200);
                });
            });
        });</script>
</body>
</html>


乌伦先生
{
宽度：200px；
}
保险商实验室
{
列表样式：无；
显示：无；
}
ulli
{
填充物：5px；
宽度：150px；
}
ulli：悬停
{
背景：#777；
}







$（文档）.ready（函数（）{
$（“.urun”）.hover（函数（）{
$（“ul”）。向下滑动（250）；
$（“ul”）.mouseleave（函数（）{
$（“ul”）。slideUp（200）；
});
});
});

不知什么原因，当您使用jQuery 1.10时，JSFIDLE的代码片段在ie8上似乎无法正常工作。我已经在jsbin上添加了您的示例：-它在那里工作得很好

Hover可以通过这种方式处理两个功能：

$(element).hover(function() {
    // your "mouseenter" event
}, function() {
    // your "mouseleave" event
});

你只是用了一种错误的方式。查看页面了解更多信息。

您的代码运行良好，只需将您的jquery版本更改为例如1.9.1

使用.hover函数与

$(selector).mouseenter(handlerIn).mouseleave(handlerOut);

因此，如果混合使用这两种方法，则应将函数hover更改为：

$(".urun").hover(
function () {
    $("ul").slideDown(250);
},

function () {
    $("ul").slideUp(200);
});

编辑：

我认为使用jquery版本1.10.1会出现问题，如果使用1.10.0，效果会很好。

您的IE版本是什么？它在JSFIDLE上不起作用，但通常可以工作。检查此示例：您是否尝试，将图像首先悬停在ul上。我知道，就像我said@fthmad9-如果您的意思是，当您将光标指向菜单旁边的区域时，菜单会隐藏，那么这里有一个快速修复方法-例如，您可以使用另一个容器包装图像和菜单：。如果fthmad9特别想使用1.10，则建议更改库的版本没有多大帮助。