js 弹出层的问题

Question

求教个js效果，
像当当网一样，www.dangdang.com
左边 图书频道，鼠标放上去，就会弹出下级菜单，请问这个是怎么实现的， 谢谢大家

Answer 1

这个不难吧<LI class=li2><A onmouseover="showwindowExtra(this,'sortBox',3,4,4)" style="CURSOR: default" onmouseout="hidewindowExtra('sortBox',4);" href="javascript:void(0);">文　艺</A>这是他的代码 <script language="javascript" src="js/sortBox.js" type="text/javascript"></script>
    <script src="js/AC_RunActiveContent.js" type="text/javascript"></script>    
    <script src="js/default.js" type="text/javascript"></script>   
    <script language="javascript" src="js/action.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/research.js"></script>这个几个JS你下回来看哪个JS里有showwindowExtra和hidewindowExtra这2个函数

Answer 2

    <script language="javascript" src="js/action.js" type="text/javascript"></script>是这个JS里面有http://home.dangdang.com/js/action.js
用这个地址下载

Answer 3

你把它首页的代码下下来.然后再把首页用到的js和css下下来.就可以慢慢弄了<link href="css/ddindex.css" rel="stylesheet" type="text/css" />    
    <link href="css/research.css" rel="stylesheet" type="text/css" /> 
     <script language="javascript" src="js/sortBox.js" type="text/javascript"></script>
    <script src="js/AC_RunActiveContent.js" type="text/javascript"></script>    
    <script src="js/default.js" type="text/javascript"></script>   
    <script language="javascript" src="js/action.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/research.js"></script>这是它用到的JS和 CSS

Answer 4

实际上就是用JS弹出浮动的Div,这样说就简单了撒

Answer 5

<style type="text/css">
.f{
border-bottom:1px solid #999999; border-right:1px solid #999999; border-top:1px solid #999999;
cursor:pointer;
position:absolute;
width:240px;
height:100px;
padding:2px 0 0 15px;
background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20081017/161257260.p.gif);
background-repeat:no-repeat;
background-position:0px -4px;
}
.a{
border-bottom:1px solid #999999; border-left:1px solid #999999; border-top:1px solid #999999;
font-weight:bold; 
}</style>
<script>
var oo = true
function create(){
document.getElementById("text").className="a"
if(oo==true){
oo=false
var div =document.createElement("div")
div.className="f"
div.id="div"
div.innerHTML="大法师"
document.body.appendChild(div)
document.getElementById("div").style.left=document.getElementById("text").offsetLeft+35
document.getElementById("div").style.top=document.getElementById("text").offsetTop
div.onmouseout=del
}}function del(e){
e=e||event;
var obj=e.relatedTarget||e.toElement;
var div =document.getElementById("div")
if(div.contains(obj))return;
document.body.removeChild(div)
document.getElementById("text").className=""
oo=true
}</script>
<span  id="text" onmouseover="create()" style="cursor:pointer;  " onMouseOut="del()" >人族</span><br>
一条竖线的背景图片而已！！