Javascript 单击打开div菜单，单击鼠标关闭并单击鼠标

嗨，我在菜单上加了一个div。为了支持触摸设备，im使用Jquery来打开和关闭，而不是使用css。使用普通菜单，但在删除div时似乎无法使其正常工作

我知道div是李嘉诚的孩子，并且已经瞄准了它，但它关闭了，但默认情况下我相信，因为它会很快关闭，而不是很好地向上滑动。然后，菜单也会在悬停后打开和关闭

仍然试图让它关闭点击，但代码也不好

html------

JQuery---

$（'a.dropsmall'）。单击（函数（e）{
$（this）.next（“div”）.slideDown（200，'easeOutCirc'）；
log（'div clicked'）；
e、 预防默认值（）；
返回false；
});
$（'li.mainmenudrop'）.mouseleave（函数（）{
$（this.parent（“div”）.slideUp（300，'easeInOutQuad'）；
});
美元。扩展（$。宽松，
{
easeInOutQuad：函数（x，t，b，c，d）{
如果（（t/=d/2）<1）返回c/2*t*t+b；
返回-c/2*（（-t）*（t-2）-1）+b；
},
easeOutCirc：函数（x、t、b、c、d）{
返回c*Math.sqrt（1-（t=t/d-1）*t）+b；
},
easeInOutElastic：函数（x，t，b，c，d）{
var s=1.70158；var p=0；var a=c；
if（t==0）返回b；if（（t/=d/2）==2）返回b+c；if（！p）p=d*（.3*1.5）；
如果（a

点击关闭

拨弄

---

这些是导致问题的原因：

.dropout_1dropbox {
    left:-999em; /* Hides the drop down */
    display: none;
}

#mainmenu li:hover .dropout_1dropbox{
    left:auto;
    right:-1px;
}

$('li.mainmenudrop').mouseleave(function() {
    $(this).parent("div").slideUp(300,'easeInOutQuad');
});

left:-999em

是鼠标悬停后下拉列表消失的原因，因为它不再处于悬停状态，因此

left:auto

和

right:-1px

不再适用

确实没有理由让下拉列表既不显示也不显示在屏幕外。您可以让下拉列表始终处于正确的位置，而不显示

.dropout_1dropbox {
    left:auto;
    right:-1px;
    display: none;
}

您的

slideUp

选择器不正确。应该是：

$('li.mainmenudrop').mouseleave(function() {
    $(this).children("div").slideUp(300,'easeInOutQuad');
});

原始答案

jQuery提供的唯一不使用插件的功能是

swing

和

linear

。您试图使用的是仅可从jQuery UI获得的

easeOutCirc

如图所示：

从jQuery1.4.3开始，可以使用一个可选的字符串来命名函数 被使用。缓和功能指定动画播放的速度 在动画中的不同点进行唯一的放松 jQuery库中的实现是默认的，称为swing， 还有一种是以恒定的速度进行的，称为线性的。更宽松 使用插件可以使用函数，最明显的是 jqueryui套件

如果检查控制台，则会出现以下错误：

Uncaught TypeError: jQuery.easing[this.easing] is not a function

---

在firefox的开发者视图中，您是否收到任何错误？或者在我希望它如何运行方面的错误

.dropout_1dropbox {
    left:auto;
    right:-1px;
    display: none;
}

$('li.mainmenudrop').mouseleave(function() {
    $(this).children("div").slideUp(300,'easeInOutQuad');
});

Uncaught TypeError: jQuery.easing[this.easing] is not a function