弹出框，当鼠标悬停DIV [英] Pop up box when hover over div

问题描述

我正在使用VS 2013 asp.net。

I am using asp.net in VS 2013.

我想，当用户将鼠标悬停在一个div来显示一个弹出窗口。我有3个div的页面上，他们是各自约了一个正方形。 50×50。当用户将他们的鼠标移到每一个我希望出现一个不同的弹出框。

I want to display a pop up window when a user hovers over a div. I have 3 divs on the page and they are each a square of approx. 50x50. When the user brings their mouse over each one I want a different pop up box to appear.

我已经玩有关与hovermenuextender来实现这一点，但林不成气候，因为它需要一个控制作为其目标。反正有一个Ajax控件来实现这一目标？

I have been playing about with the hovermenuextender to achieve this but Im not getting anywhere as it needs a control as its target. IS there anyway to achieve this with an Ajax control?

感谢

推荐答案

您可以试试这个：

第1步：请用不同的ID在你的HTML三个弹出窗口风格=显示：无;位置：绝对的;最高：50％;左：50％;。和类名弹出。

step 1: Keep the three pop ups with different ids in your html with style = "display:none;position:absolute;top:50%;left:50%;". and a classname popup.

例如。

<div class="popup" id="1" style = "display:none;position:absolute;top:50%;left:50%;"></div>

第2步：给类名（隐藏层的各自的ID）添加到您的div上用户将鼠标悬停和parent属性您的div。

step 2: Give classname (respective ids of hidden divs) to your divs on which user will hover and a parent attribute to your divs.

例如。

<div class="showdiv" parent="1"></div>

第3步：现在写下面的code：

step 3: now write following code:

  $(document).ready(function() {

           $('.showdiv').mouseover(function() {

              $(".popup").hide();
              $("'#"+$(this).attr('parent')+"'").show();                       

           });     

  });

    try prop if attr doen't work.

这篇关于弹出框，当鼠标悬停DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！