如何打开悬停事件与可点击的内容弹出 [英] how to open a popup on hover event with clickable contant

查看:138
本文介绍了如何打开悬停事件与可点击的内容弹出的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



我试图用可点击的内容创建一个弹出窗口。



现在,我发现我可以通过内容将点击事件绑定到弹出窗口:

  marker.on('click',function (e){
marker.bindPopup(< div />)。openPopup();
}

我发现了如何在悬停时创建弹出窗口:

  marker.on 'mouseover',function(e){
e.target.bindPopup(< div />)。openPopup();

}});

marker.on('mouseout',function(e){
e.target.closePopup();

}});

现在我似乎无法做的是让弹出窗口保持打开状态,以便用户点击弹出窗口中的链接。感谢任何帮助。

解决方案

一种方法是 http://jsfiddle.net/cxZRM / 98 /
基本上它会为您的设置添加一个计时器,并且您只会在经过任意长时间后才关闭弹出窗口,以便为用户提供一些时间在div上进行交互。


$ b $

  marker.on('mouseover',function(e){
e.target.bindPopup(dsdsdsdsd)。openPopup );
start = new Date()。getTime();
});

marker.on('mouseout',function(e){
var end = new Date()。getTime();
var time = end - start;
console.log('Execution time:'+ time);
if(time> 700){
e.target.closePopup();
}
}) ;

更好的方法是使用 http://jsfiddle.net/AMsK9/
来确定您的鼠标位置,并在鼠标仍在弹出窗口周围区域时保持弹出窗口打开。


i am currently working with leaflet.

and i am trying to create a popup with with clickable content.

now i found how i can bind popups on click event with content:

marker.on('click', function(e){
     marker.bindPopup("<div />").openPopup();
}

and i found out how to create the popup on hover:

marker.on('mouseover', function(e){
    e.target.bindPopup("<div />").openPopup();

    }});        

marker.on('mouseout', function(e){  
    e.target.closePopup();

}});

now what i cant seem to do is make the popup stay open in order for the user to click on links inside the popup. i would appreciate any help.

解决方案

one approach is this http://jsfiddle.net/cxZRM/98/ basically it's adding a timer to your setup and you only close the popup after an arbitrarily long time has passed so as to give the user some time to interact on your div.

marker.on('mouseover', function(e){
    e.target.bindPopup("dsdsdsdsd").openPopup();
    start = new Date().getTime();
  });        

marker.on('mouseout', function(e){  
    var end = new Date().getTime();
    var time = end - start;
    console.log('Execution time: ' + time);
    if(time > 700){
    e.target.closePopup();
    }
});

a better approach would be to use http://jsfiddle.net/AMsK9/ to determine your mouse position and keep the popup open while the mouse is still within an area around the popup.

这篇关于如何打开悬停事件与可点击的内容弹出的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆