如何使一个层在某个位置向上显示？

style 控制相关属性：top ,left

解决方案 »

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

<div  id="aDiv"  style="position:absolute;display:none;background-color:red">内容
asdfasfdasdf
<br><br><br><br><br><br></div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<input type="button" value="Click me" id="ab" onclick="aDiv.style.pixelLeft=ab.getBoundingClientRect().right;aDiv.style.pixelBottom=document.body.clientHeight-ab.getBoundingClientRect().bottom;aDiv.style.display=''">试试这段
我在做工程的时候写过一个代码，可能是你想要的效果，但是是自动生起来的。是缓缓升起来的样子，代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var sc = -200;
var flagguo;
var scrollFlag = false;
var offtops;//初始的时候，让div循环显示出来
function showMessage(){
var oDiv = document.getElementById("msg");
oDiv.style.bottom = sc;

sc += 10;
gh = setTimeout("showMessage()",125);
if(sc==10){
clearTimeout(gh);
offtops = oDiv.offsetTop;
scrollFlag = true;
}}//去除检测div的位置的循环
function clearAllTimes(){
clearTimeout(flagguo);
}//让循环来检测div的位置，始终保持在bottom附近
window.onscroll=function () {
if(scrollFlag){
var oFix=document.getElementById("msg");
oFix.style.top=(offtops+document.documentElement.scrollTop)+"px";
}
}window.onresize=function(){
var oDiv = document.getElementById("msg");
oDiv.style.display = "none";
clearAllTimes();
scrollFlag = false;
}</script>
</head><body onload="showMessage()"><div id="msg" style="width:250px; height:150px; background-color:#FF0000; right:0px; bottom:-200px; position:absolute;"></div>
<table width="500" height="2000" border="0" cellpadding="0" cellspacing="1">
  <tr>
    <td><a name="liang" id="liang"></a></td>
    <td style="word-break:break-all;word-warp:warp;" width="10" height="25">1111111111111111111111111111111111111111111111</td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
</table>
</body>
</html>
如果第一次打开不起作用，可以刷新一下。你如果要这种效果，只需要把他升起来的引发事件放到一个按钮上就应该可以了，现在我是放到body的onload事件里面了。
刚想到，你想要的div是不定高的，可以用div的属性来取出来高，不像我那杨写死了就行了
<td valign=bottom>
按键
DIV
</td>