简单的jQuery拉网

我试图实现最基本的，纯jQuery的弹出窗口。简单的jQuery拉网

目前，我正在使用的代码从this教程，并更换变淡用。开（）。该窗口弹出，但随着事件被绑定到多个环节，用户可以在任何地方点击，但弹出不管用户对paege位置在同一个地方显示出来。

如何获得弹出窗口以适应用户在页面上的位置（与SO编辑器中的超链接弹出窗口完全相同）？

谢谢。

2011-02-01 kmurph79

你要选的任何回答您发现有帮助的问题，并接受最能帮助您的答案。这些行动有助于奖励那些贡献自己时间来帮助你的人，他们帮助具有类似问题的网站的未来用户找到最佳答案，他们鼓励人们回答你未来的问题，并帮助你的声誉。 – Phrogz 2011-04-06 22:31:12

你应该检查出太极拳 - http://www.shadowbox-js.com

可以做出基本的，只要你想，它是非常容易使用，并落实到你的系统。

来源

2011-02-01 11:27:51 xil3

是否有可能使用太极拳任何东西非常......我可以把形式呢？我不确定你是否看到过这个邪恶的应用程序，但我想弹出一个窗口，然后通过该窗口中的一系列步骤。 – 2012-10-14 16:19:58

相反的<a href="#">，尝试：<a href="#dialog">与<div id="dialog" class="window" name="dialog">

最终取代<div id="dialog" class="window">，将“＃”是当前页面的顶部;通过插入命名锚，其中的一次出现在屏幕上你的对话框，视口将被设置使得命名锚（即，对话）是在屏幕的顶部。

来源

2011-02-01 11:31:04 aendrew

是否要定位弹出相对于另一个元素？（你点击或悬停在等...）？在这种情况下，

popup_location = $('#clickme').offset(); 

//optional adjust position 
popup_location['top'] = popup_location['top'] + 20; 
popup_location['left'] = popup_location['left'] + 20; 

$('#your_popup').css(tooltip_position);

来源

2011-02-01 11:31:06 calumbrodie

您也可以使用Jquery.cluetip获得相同的效果。它会一直打开接近链接。

来源

2011-02-01 11:32:29 Kimtho6

我使用.offset()获得者和.css('line-height')作为live sample的裸机弹出交互。

的.offset()制定者不会产生上比Firefox等浏览器的预期结果。我相信这是为什么努力得到一个简单的弹出主要的原因是为了“挑战” ...在下面的示例中，请注意.css()二传手是如何使用的，而不是offset()：

$('li > a').click(function (event) { 
    event.preventDefault(); 
    var coordinates = $(this).offset(); 
    var lineHeight = parseInt($(this).css('line-height')); 

    if (window.console) { console.log("coordinates.left: " + coordinates.left); } 
    if (window.console) { console.log("coordinates.top: " + coordinates.top); } 
    if (window.console) { console.log(".css('line-height'): " + lineHeight); } 

    $('.PopUpFlow') 
     .css('left', coordinates.left) 
     .css('top', coordinates.top + lineHeight) 
     .show(); 
}); 
$('.PopUpFlow p > a').click(function (event) { 
    event.preventDefault(); 
    $(this).closest('div').hide(); 
});

来源

2011-02-23 02:22:18 rasx

简单的jQuery拉网

回答

相关问题