相关疑难解决方法(0)

如何检查鼠标是否在jQuery中的元素上?

有没有一种快速简便的方法在jQuery中做到这一点,我错过了?

我不想使用鼠标悬停事件,因为我已经将它用于其他事情.我只需要知道鼠标是否在给定时刻超过元素.

如果只有"IsMouseOver"功能,我想做这样的事情:

function hideTip(oi) {
    setTimeout(function() { if (!IsMouseOver(oi)) $(oi).fadeOut(); }, 100);
}
Run Code Online (Sandbox Code Playgroud)

jquery mouseover

261
推荐指数
10
解决办法
32万
查看次数

如何防止触摸设备上按钮的粘滞悬停效果

我创建了一个带有前一个和下一个按钮的旋转木马,它们始终可见.这些按钮具有悬停状态,它们变为蓝色.在触控设备(如iPad)上,悬停状态是粘性的,因此按下按钮后按钮会保持蓝色.我不希望这样.

  • 我可以为每个按钮添加一个no-hoverontouchend,并使我的CSS像这样:button:not(.no-hover):hover { background-color: blue; }但这可能对性能非常不利,并且不能正确处理Chromebook Pixel(同时具有触摸屏和鼠标)等设备.

  • 我可以添加一个touchdocumentElement,并使我的CSS像这样:html:not(.touch) button:hover { background-color: blue; }但这也不适用于同时具有触摸和鼠标的设备.

我更喜欢的是删除悬停状态ontouchend.但这似乎不太可能.聚焦另一个元素不会消除悬停状态.手动点击另一个元素,但我似乎无法在JavaScript中触发它.

我发现的所有解决方案似乎都不完美.有完美的解决方案吗?

javascript css hover touch

130
推荐指数
8
解决办法
10万
查看次数

jQuery/JavaScript碰撞检测

如何检测两个<div>元素是否发生碰撞?

两个div是相互垂直的简单彩色盒子,因此没有复杂的形状或角度.

html javascript jquery collision-detection

75
推荐指数
5
解决办法
7万
查看次数

当悬停在工具提示上时,jQuery .tooltip()不隐藏?

当我在悬停时,我正在元素中间显示一个jQuery UI工具提示.但是当悬停在工具提示上时,工具提示本身就会消失.(propagation问题)

元件:

在此输入图像描述

使用工具提示:

在此输入图像描述

因此,当我将工具提示本身悬停时,由于传播问题,它会消失,我想.

HTML:

<div class="bar-wrapper">
    <label class="bar-lbl active one" title="2013"><span>2013</span></label>

    <div class="bar" data-percent="90"></div>
    <div class="bar-rest-overlay" data-percent="10"></div>
</div>

<div class="bar-wrapper">
    <label class="bar-lbl active one" title="2014"><span>2014</span></label>

    <div class="bar" data-percent="80"></div>
    <div class="bar-rest-overlay" data-percent="20"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

当前代码:

$('.bar-lbl').tooltip(
{
    tooltipClass: 'bar-tooltip',
    position:
    {
        my: 'center',
        at: 'center'
    }
});
Run Code Online (Sandbox Code Playgroud)

部分修复(但工具提示永久可见):

$('.bar-lbl').on('mouseleave',
function(e)
{
    e.stopImmediatePropagation();

}).tooltip(
{
    tooltipClass: 'bar-tooltip',
    position:
    {
        my: 'center',
        at: 'center'
    }
});
Run Code Online (Sandbox Code Playgroud)

不工作:

$('body').on('hover', '.ui-tooltip',
function(e)
{
    e.stopImmediatePropagation();
});
Run Code Online (Sandbox Code Playgroud)

更新:感谢Trevor,我找到了一个紧密的解决方案.(当悬停时,它仍然可以看到最后一个悬停的工具提示):

似乎,当徘徊在工具提示本身时,它隐藏起来.但是 …

jquery jquery-ui

6
推荐指数
1
解决办法
9470
查看次数

检测悬停是否存在或是否可用

每个人都在推动功能检测很长一段时间.我想检测访问者的浏览器是否支持:hover伪类.我的理解是,有足够的(如果不是大多数)移动设备不支持悬停,所以我想相应地设置我的事件监听器.但是如果没有移动侦测,我不确定如何实现这一点,到目前为止我还没有通过Google或SO找到任何东西.

也许类似于问题#8981463

$(function() {
  var canHover = $(document).is(":hover");
});
Run Code Online (Sandbox Code Playgroud)

直到下周我才能在移动设备上测试这个.

思考?

javascript css jquery

5
推荐指数
2
解决办法
3915
查看次数

替代javascript中的多个if else语句

我的问题非常类似于Reduce multiple if语句

我有多个if else语句,我想使用jquery每个函数来使代码更有效,但我无法弄清楚如何做到这一点.

我在wordpress中运行jQuery,我相信在noconflict模式下运行,所以我不能得到更多(我考虑的)高级主题,这些主题为我提供了示例,因为我无法理解正确的功能要使用的语法.

如果有人可以帮助并解释如何为我做这将是惊人的.这是我的代码:

var $h6p = $("h6 + p");
var $h5p = $("h5 + p");
var $h4p = $("h4 + p");
var $h3p = $("h3 + p");
var $h2p = $("h2 + p");
var $h1p = $("h1 + p");
var $fullercolor_bg = "rgba(240,234,222,0.9)";

if($h1p.mouseIsOver()) {
    $h1p.prev().css("background-color", $fullercolor_bg);
} else {
    $h1p.prev().css("background-color", "");
}
if($h2p.mouseIsOver()) {
    $h2p.prev().css("background-color", $fullercolor_bg);
} else {
    $h2p.prev().css("background-color", "");
}
if($h3p.mouseIsOver()) {
    $h3p.prev().css("background-color", $fullercolor_bg);
} else {
    $h3p.prev().css("background-color", "");
}
if($h4p.mouseIsOver()) { …
Run Code Online (Sandbox Code Playgroud)

javascript syntax wordpress jquery if-statement

1
推荐指数
1
解决办法
1699
查看次数