1

我知道这听起来很傻，但我想做的是触发点击，一些 html 元素悬停在另一个元素上。

假设我们得到了悬停锚文本的 .cursor。在这种情况下，点击 .cursor 应该会打开一个谷歌页面。

<div class="cursor"></div> 
<div class="htmlPage">
    <a href="www.google.com">Google</a>
    <a href="www.facebook.com">Faccebook</a>
     <a href="www.stackoverflow.com">Stack</a>
</div>

任何想法如何做到这一点？

这不算数

$('.cursor').click(function(){
     $('.htmlPage a').click();
})

光标应该是可移动的，并且应该能够点击其他链接。

谷歌上的光标

光标是悬停在 Google 按钮上的蓝色圆圈。在这里，我将光标放在谷歌上，现在点击它应该链接到谷歌，如果我要点击堆栈，那么堆栈应该已经打开。

4

6 回答 6

3

如果您不使用 IE，则可以pointer-events:none在 CSS 中使用。然后您的元素将对任何鼠标交互都没有响应（并且像幽灵前景元素一样）。

IE 的解决方法是这样的：

var x = event.pageX;
var y = event.pageY;
$('.cursor').hide();
var here = document.elementFromPoint(x, y);
$('.cursor').show();
// Do what you want with the element here
// Find the parent a element needed with here.parentNode and here.tagName === "A"
// And then fire the click function

我从未使用过 jQuery，但我认为它应该可以工作。

希望它可以帮助

于 2013-07-15T13:51:00.290 回答
1

您可以尝试在单击时获取“.cursor”位置并与每个“.htmlPage a”位置进行比较，并使用重叠的元素之一更改 window.location.href 

$(".cursor").click(function(){
    var cursor=$(this);
    var cl = cursor.offset().left;
    var cr = cl+cursor.width();
    var ct = cursor.offset().top;
    var cb = ct+cursor.height();
    $(".htmlPage a").each(function(){
        var page=$(this);
        var pl = page.offset().left;
        var pr = pl+page.width();
        var pt = page.offset().top;
        var pb = pt+page.height();
        if(((cl>pl&&cl<pr)||(cr>pl&&cr<pr))&&((ct>pt&&ct<pb)||(cb>pt&&cb<pb))){
            window.location.href=page.attr("href");
        }        
    });
}).draggable();

http://jsfiddle.net/EUmeB/

于 2013-07-12T18:37:29.947 回答
0

尝试这个：

演示

// Target link in the next div, following div.cursor
$("div.cursor").click(function() {
    var link = $(this).next(".htmlPage").children("a").attr("href");
    window.location.href = link;
});
于 2013-07-12T16:50:15.550 回答
0 
$('.cursor').click(function(){
     $('.htmlPage a').click();
})
于 2013-07-12T16:50:18.373 回答
0

将事件处理程序附加到游标类。

$('.cursor').on('click',function()
{
    window.location.href = $(this).siblings('.htmlPage').attr('href');
}

这将获取元素的兄弟元素并使位置等于该兄弟元素

于 2013-07-12T16:52:08.490 回答
0

更明确地说，这可能是最好的。

$('.cursor').click(function(){
  $(this).next().children('a').click();
});
于 2013-07-12T16:52:26.247 回答