鼠标放上后下面出来个框框怎么弄？？

就是把鼠标放到莫个区域后，那一块儿用红框圈住
并且斜下方出来个小框上面写着一些标题类的东西

求各位帮忙给个例子或者说一说它实现的原理

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

你要用的struts2  标签里面就有这个属性tip来设置
<div id="container"><input type="text" id="txt1" name="txt1" onmouseover="setHint(this);" /></div>
<script type='text/javascript'>
var h;
function setHint(elem)
{
elem.style.border='1px red solid';
if (h!=null)
{
h.parentNode.removeChild(h);
h = null;
}
h = document.createElement('DIV');
h.style.width = '100px';
h.style.height = '50px';
h.style.border = 'blue 1px solid';
h.innerHTML = 'Oops';
elem.parentNode.appendChild(h);
setTimeout("clear("+elem.id+")", 1000);
}
function clear(elem)
{
if (elem)
elem.style.border = "";
if (h!=null)
{
h.parentNode.removeChild(h);
h = null;
}
}
</script>
<div id="container"><input type="text" id="txt1" name="txt1" onmouseover="setHint(this);" /></div>
<script type='text/javascript'>
var h;
function setHint(elem)
{
elem.style.border='1px red solid';
if (h!=null)
{
h.parentNode.removeChild(h);
h = null;
}
h = document.createElement('DIV');
h.style.width = '100px';
h.style.height = '50px';
h.style.border = 'blue 1px solid';
h.style.position = "relative";
h.style.left = "100px";
h.style.backgroundColor="gray";
h.style.color="white";
h.innerHTML = 'Oops';
elem.parentNode.appendChild(h);
setTimeout("clear("+elem.id+")", 2000);
}
function clear(elem)
{
if (elem)
elem.style.border = "";
if (h!=null)
{
h.parentNode.removeChild(h);
h = null;
}
}
</script>
你要是想从数据库里读点东西出来的话，还要用到轻量级的ajax技术啦
很简单的，其实原理就是css+javascript，用了绝对定位，首先把需要出现的那个div display=none，等鼠标移动过去的时候，改成display=block.
如果不涉及到向后台请求数据，就很简单了。
<html>
<head>
<style>
.border{
border:1px solid black;
}
</style>
</head>
<body>
<div title="这就是斜下方的小框要显示的东西" style="width:200px;height:200px;font-size:30" onmouseover="this.className='border'" onmouseout="this.className=''">
鼠标上来
</div></body>
</html>

鼠标放上后 下面出来个框框怎么弄？？

解决方案 »

鼠标放上后下面出来个框框怎么弄？？