使用Javascript动态弹出位置更改

问题描述：

我需要动态更改弹出窗口的位置，就像我显示popup onmouse悬停的超链接一样，弹出窗口总是显示在超链接的底部，在这种情况下当超链接在浏览器的末尾然后超过一半的去隐藏。

所以，我需要根据空格改变弹出位置，如果超链接在末尾，则弹出显示在超链接的顶部，否则在底部。

我怎么能完成这个任务？

I need to change the position of popup dynamically like when i show popup onmouse hover of hyperlink, popup always shows at bottom of the hyperlink, in this case when hyperlink is at end of the browser then more than half of the goes hide.

So, I need the popup position change according to the space, if the hyperlink is at end then popup show at top of the hyperlink otherwise at bottom.

How could i achieve this task ?

答

这就是你可能在寻找的东西

this is what you might be looking for

<body style="height:1000px;">
        <div style="margin-top:800px;"></div>
        <a href="" class="link" onmouseover="showTitle()">your link<span class="anchorTitle" id="link"> show title</span></a><body></body></body>

<script>
function showTitle(){
	var link = document.getElementById("link");
	
	if(screen.height	 	link.style.top="-200%";
	}else{
		link.style.top="100%";		
	}
}
</script>

<style>
.link{
position:relative;		
}
.anchorTitle{
display:none;
position:absolute;
background:#F60;	
}
.link:hover .anchorTitle{
display:block;	
background:#F60;
}
</style>

使用Javascript动态弹出位置更改

相关推荐