js+css实现一个功能

kidbei 发布于 2013/05/14 10:05
阅读 136
收藏 0

就这个效果,鼠标移动到昵称上面就弹出层,我css写得太烂了,不会实现。。。求各位给个插件或给个代码。主要是不知道怎么确定弹出层的位置。

加载中
0
保密保密
保密保密

常用的方法,设置以个隐藏的DIV如:<div id="d" style="display:none">这里面放你想放的东西</div>

JS:鼠标经过事件.onmouseover,离开是onmouseout

定位标签:var d=document.getElementById('d');

<!DOCTYPE HTML>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
            <title>xxx</title>
            <style type="text/css">

            </style>
           
        </head>
        <body>
                <a id="d" href="#">查看</a>
                <div id="f" style="width:320px;height:320px;border:1px solid #ddd;display:none" >
                    asdjklh;alsdkjhaksjhlksdj
                </div>
                 <script type="text/javascript">
                    var d=document.getElementById('d');
                    var f=document.getElementById('f');
                    d.onmouseover=function(){
                        f.style.display='block';
                    }
                    f.onmouseout=function(){
                        f.style.display='none';
                    }
            </script>
        </body>    
    </html>


kidbei
kidbei
后台
kidbei
kidbei
谢谢你的回答,不过这个方法不是很好啊,这样一来我必须先给隐藏的div里面初始化好数据,如果我的数据要从后来获取,而我一个页面有非常多的地方需要这种功能,那得初始化多少?理想情况下是鼠标移动到特定标签后然后再这个标签下面或上面弹出层,用ajax去后台取数据,大部分网站也是这么做的。问题是我不会css,不知道弹出的时候怎么定位才能让弹出的层在我想要的位置。
0
kidbei
kidbei

就像这个,这是ajax从后台取得数据,我现在想要的是弹出的这个层怎么写,js我会,就是不知道css怎么写,一直没怎么接触过css.....

0
小宏
使用父级定位啊 。左右位置可以根据鼠标位置来确定
0
保密保密
保密保密

这蛋疼...你就把div,定位吧,不管是相对定位,还是绝对定位,相对 position:relative;   position:absolute;

left:

right:

设置左右距离

kidbei
kidbei
是把这个div append到目标节点里面么? left和right从哪里计算出来的呢?
返回顶部
顶部