<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>javascript的动态显示</title>

		<style>

			a{

				display:block;

				height:50px;

				width:50px;

			}

		</style>

	</head>

	<body>

		<a href="http://www.baidu.com" title="baidu">百度</a>

		<a href="http://www.baidu.com" title="baidu">百度</a>

		<a href="http://www.baidu.com" title="baidu">百度</a>

		<a href="http://www.baidu.com" title="baidu">百度</a>

		<script>

			(function(){

				var as=document.getElementsByTagName("a");

				for(var i=0;i<as.length;i++){

					as[i].onmouseover=mouseover;

				}

				function mouseover(){

					var div=document.createElement("div");

					div.style.position="absolute";

					console.log(window.event.clientY);

					div.style.top=window.event.clientY+'px';

					console.log(div.style.top);

					div.style.left=window.event.clientX+'px';

					div.innerHTML="链接到百度";

					document.body.appendChild(div);

				}

			})(window);

		</script>

	</body>

</html>