预览窗口功能类似于StackOverflow标记

时间:2012-10-05 09:10:58

标签: javascript preview

我正在尝试使用javascript创建项目预览(quickview),根据鼠标位置改变它的方向。我希望有一个类似于stackoverflow中存在的功能:

当项目位于页面底部时,预览窗口应更改其方向(滚动页面或调整浏览器窗口大小时)。目前它显示在光标的下方或上方,但它与实际光标位置无关(与屏幕或浏览器窗口大小无关)。我是javascript的新手,非常感谢任何帮助。

以下是我使用的代码作为起点:

function AssignPosition(d) {

if(self.pageYOffset) {
    rX = self.pageXOffset;
    rY = self.pageYOffset;
    }
else if(document.documentElement && document.documentElement.scrollTop) {
    rX = document.documentElement.scrollLeft;
    rY = document.documentElement.scrollTop;
    }
else if(document.body && document.body.scrollTop) {
    rX = document.body.scrollLeft;
    rY = document.body.scrollTop;
    }
if(document.all) {
    cX += rX; 
    cY += rY;
    }

var divHeight = d.style.height.replace(/px/, "");
divHeight = parseInt(divHeight);
if (cY < divHeight * 3 ) {
    d.style.left = (cX+50) + "px";
    d.style.top = (cY-10) + "px";
    }

else {
    cY = cY - divHeight;
    d.style.left = (cX+50) + "px";
    d.style.top = (cY-10) + "px";
    }

}

0 个答案:

没有答案