Question

当您点击标记链接时，如何创建弹出窗口/消息，就像您在此网站上看到的那样

Answer 1

您可以使用jQuery插件，因为您已将其标记为jQuery。 Tooltip是一个很好的，你可以在事件处理程序中使用。

Answer 2

这是一个自定义解决方案。只需创建一个div，将其淡入，并将其定位在您单击的位置。

jQuery的：

$('document').ready(function() {

    $('#target').click(function (event) {
        var x = event.pageX;
        var y = event.pageY
        $('<div id="popup">Click to close</div>').appendTo('body');
        $('#popup').css({opacity:0,display:'block',top:y,left:x}).animate({opacity: 1}, 300);
    });

    $('#popup').live('click', function() {
        $(this).animate({opacity: 0}, 300, function(){$(this).remove();});
    });

});

CSS：

#target {
            cursor: pointer;
            position:absolute;
            top: 100px;
            left: 100px;
            background: orange;
            border: 2px solid red;
            color: white;
            padding: 10px;
        }

        #popup {
            width: 100px;
            height: 100px;
            background: #EEE;
            border: 4px dashed purple;
            position: absolute;
            display:none;
        }

HTML：

<div id="target">click here</div>

像SO Flag窗口一样弹出消息

2 个答案: