急等，如何用JS与CSS实现：在页面点击文字弹出DIV层效果，注意DIV层在文字旁边？

Question

补充：

          JS方法里能实现多个DIV层效果，当点击其它文字时，弹出来的DIV层只能是该文字下的DIV内容。

其他DIV层内容隐藏。

        弹出DIV层一定要在文字旁边上方显示，而且DIV层里有可以点击关闭功能和内容显示？

[b]问题补充：[/b]
你贴出的例子

这从哪里找呀？
[b]问题补充：[/b]
我进你的空间没有看见呀
[b]问题补充：[/b]
发个实例过来呀？我现在正在做，就是不成功呀？

[b]问题补充：[/b]
我没有看见呀，在哪里呀？
[b]问题补充：[/b]
看见了，我先试试呀？谢谢
[b]问题补充：[/b]
我的妈呀，不是这种？

我要的是弹出层？
[b]问题补充：[/b]
补充：

点击页面不同的查看详细文字，就显示出不同的DIV层？
1，
在以下方法里弹出层方法
function testMessageBox1(ev)
{
var objPos = mousePosition(ev);
messContent =”“
showMessageBox('要要',messContent,objPos,580,100);
}

  我想把div显示与隐藏用这个方法控制： 

function dis(){   
    var t=document.getElementsByTagName("div");   
     for(i=0;i<t.length;i++){   
        if(t[i].style.background=="#fffffe")
        {   
            t[i].style.display="none";   
         }  
         else
         { t[i].style.display="block";
         } 
     }   

}

2，页面如下：

查看详细

查看详细

[b]问题补充：[/b]
不过我这个弹出层好像有问题，

就是显示出来的DIV层它有时看不见？

你帮我全部在页面居中显示也可以？

先说谢谢了？
[b]问题补充：[/b]
问题在于我弹出层的JS脚本：

帮我看看：

可不可以改：
var isIe=(document.all)?true:false;
//设置select的可见状态
function setSelectState(state)
{
var objl=document.getElementsByTagName('select');
for(var i=0;i {
objl[i].style.visibility=state;
}
}
function mousePosition(ev)
{
if(ev.pageX || ev.pageY)
{
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
//弹出方法
function showMessageBox(wTitle,content,pos,wWidth)
{
closeWindow();
var bWidth=parseInt(document.documentElement.scrollWidth);
var bHeight=parseInt(document.documentElement.scrollHeight);
if(isIe){
setSelectState('hidden');}
var back=document.createElement("div");
back.id="back";
var styleStr="top:0px;left:0px;position:absolute;background:#666;width:"+bWidth+"px;height:"+bHeight+"px;";
styleStr+=(isIe)?"filter:alpha(opacity=0);":"opacity:0;";
back.style.cssText=styleStr;
document.body.appendChild(back);
showBackground(back,50);
var mesW=document.createElement("div");
mesW.id="mesWindow";
mesW.className="mesWindow"; /*控制弹出层TITLE的类*/
mesW.innerHTML="

<table width='100%' height='100%' style='background-

color:#ffffff;'>

"+wTitle+" <input type='button' onclick='closeWindow();' title='关闭窗口' class='close' value='关闭'

/>

"+content+"

";

styleStr="left:"+(((pos.x-wWidth)>0)?(pos.x-wWidth):pos.x)+"px;top:"+(pos.y)+"px;position:absolute;width:"+wWidth+"px;";
mesW.style.cssText=styleStr;
document.body.appendChild(mesW);
}
//让背景渐渐变暗
function showBackground(obj,endInt)
{
if(isIe)
{
obj.filters.alpha.opacity+=1;
if(obj.filters.alpha.opacity <endInt)
{
setTimeout(function(){showBackground(obj,endInt)},5);
}
}else{
var al=parseFloat(obj.style.opacity);al+=0.01;
obj.style.opacity=al;
if(al <(endInt/100))
{setTimeout(function(){showBackground(obj,endInt)},5);}
}
}
//关闭窗口
function closeWindow()
{
if(document.getElementById('back')!=null)
{
document.getElementById('back').parentNode.removeChild(document.getElementById('back'));
}
if(document.getElementById('mesWindow')!=null)
{
document.getElementById('mesWindow').parentNode.removeChild(document.getElementById('mesWindow'));
}

if(isIe){
setSelectState('');}
}

function testMessageBox1(ev)
{
var objPos = mousePosition(ev);
messContent="

组织两年内即将退休员工人数为

";
showMessageBox('数为',messContent,objPos,580,0);

[b]问题补充：[/b]
不知道兼容否：

都可以啦？你以前有做过类似的嘛？

有些网站上有点击人的头像，就会出现他的相关信息，也可以操作相关信息。

就是类似这种的效果？
[b]问题补充：[/b]
能不能改改呢？

我做这个都用了几天了，都快风掉了？
[b]问题补充：[/b]
你能帮我把它写全点嘛？

如果你有新的方法？

:arrow:

Answer 1

建议lz
使用一个全局的js文件对这些类似的问题作个初始化
比如一个id为demoDiv的

使用如下初始化
[code="js"]
if(!document.getElementById("demoDiv"))
{
document.write("

")
}
[/code]