使用jQuery的指针事件功能?

时间:2013-08-31 18:56:10

标签: jquery css html hover pointer-events

我正在尝试使用jQuery重新创建指针事件功能,因为指针事件在IE和Opera上不起作用。

我有一个div,当盘旋时,另一个div显示在它上面并且指针事件是至关重要的,这样当上面的div被悬停时动画不会触发:

知道如何在jQuery中执行此操作吗?我尝试过很少的东西(比如removeClass,mouseout等)但是无法到达那里:

的jQuery(尝试):

$(".soc1").hover(function(){ $(".soc1").removeClass("t1") });

HTML:

<div class="soc1"><a href="#" target="_blank" class="soc1"><span class="t1">link</span></a></div>

CSS:

.soc1 a:hover > .t1{
    margin-top:-30px;
    opacity:1;
}

.t1{
    position:absolute;
    font-style:normal;
    letter-spacing:0px;
    display:block;
    padding:4px;
    font-family:Verdana, sans-serif;
    font-size:10px;
    color:#fff;
    background-color:#090909;
    opacity:0;
    margin-left:2px;
    margin-top:-40px;
    pointer-events:none;
    cursor:default;
}

1 个答案:

答案 0 :(得分:2)

jQuery的.hover需要两个函数:第一个是鼠标进入(悬停),第二个是鼠标离开(停止悬停)

$(".soc1").hover(function mouseEnters() {
    $(".soc1").removeClass("t1");
}, function mouseLeaves() {
    $(".soc1").addClass("t1");
});

注意:名称“mouseEnters”和“mouseLeaves”是可选的。这些是“命名匿名函数”。我认为在堆栈跟踪中为匿名函数设置匿名函数是很好的,但是许多人更喜欢让它们保持未命名状态。