javascript - 将div相对于浏览器大小放在上方或下方

女士们先生们。我有一个#quicklook div。

#quicklook{
    height: 500px;
    width: 400px;
    background: #fff;
    position: absolute;
    margin-top:5px;
    margin-left:15px;
    box-shadow: 0 0 5px #BEBEBE;
    color:#000;
    z-index:100;
    display:none;
}

JQUERY

$(document).on('mouseenter','.quicklook-link',function(){
    var quicklookLink = $(this);
    quicklooktimerShow = setTimeout(function(){
        createQuickLook(quicklookLink);

          //some ajax request to load content in '#quicklook'
        },3000);

}).on('mouseleave','.quicklook-link',function(){

            clearTimeout(quicklooktimerShow);
            removeQuickLook();

});





    function createQuickLook(div){
        removeQuickLook();
        $('<div>',{
            id:'quicklook'
        }).append($('<div>',{ id:"quicklook-triangle"})).appendTo(div);

            $('#quicklook').show();


    }
    function removeQuickLook(){
        $('#quicklook').remove();
        $('#quicklook-triangle').remove();
    }

目前，当我将鼠标悬停在.quicklook-link上超过3秒时，会创建#quicklook

我想要两件事发生。


如果没有足够的空间，当我执行.mouseenter .quicklook-link时
在屏幕视口下方，然后将#quicklook放在
.quicklook-link否则将其保留在下面。就像完成
google +。
一旦鼠标从.quicklook-link离开，就会出现另一个错误
removeQuickLook()函数被调用，而#quicklook被
隐。但是我想延迟几秒钟说（3-4s）来隐藏那个
#quicklook。

最佳答案

对于时间延迟问题，您是否尝试过实现？

http://api.jquery.com/delay/

关于javascript - 将div相对于浏览器大小放在上方或下方，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23663219/