首页 > javascript > 无侵入式鼠标经过显示或隐藏效果

无侵入式鼠标经过显示或隐藏效果

2009年9月4日 luo

js部分:

<script type=”text/javascript”>
function showTag(parentId){
 var parentId= document.getElementById(parentId);
 var childTag= parentId.lastChild;
 while(childTag.nodeType!=1){
  childTag=childTag.previousSibling;
 }
 parentId.onmouseover=function(){
  childTag.style.display=”block”;
 }
 parentId.onmouseout=function(){
  childTag.style.display=”none”;
 } 
}
window.onload= function(){
showTag(“tagId”);//绑定id
}
</script>

html部分:

<div id=”tagId”>
 <div style=”background-color:#333;”>parenttag</div><!–鼠标经过显示此标签下一个兄弟标签的内容–>
    <div style=”background-color:#666;”>childTag</div>
</div>

css:

<style type=”text/css”>
.none{ display:none;}
</style>

分类: javascript 标签: ,
  1. luo
    2009年9月6日20:38 | #1

    很好!学习了!

  1. 本文目前尚无任何 trackbacks 和 pingbacks.
本文的评论功能被关闭了.