标签:
html code:
<div class="title"> <ul id="col02_left_title"> <li><a id="science_danamic" href="#">科研动态</a></li> <li><a id="teach_danamic" href="#">教学动态</a></li> </ul> </div> <div class="content"> <!--<iframe id="col02_left_content" scrolling="no" target="_parent" class="content_frame" src="content/科研动态.html"></iframe>--> <div id="col02_left_content" class="content_frame"> <div id="science_show" class="dynamic_show">科研动态-内容</div> <div id="teach_show">教学动态-内容</div> </div> </div>
css:
.dynamic_show { display:block; } .dynamic_hide { display:none; }
javascript:
function set_danamic() { var science_danamic = document.getElementById(‘science_danamic‘); var science_show = document.getElementById(‘science_show‘); var teach_danamic = document.getElementById(‘teach_danamic‘); var teach_show = document.getElementById(‘teach_show‘); teach_show.className = ‘dynamic_hide‘; science_danamic.onmouseover = function () { science_show.className = ‘dynamic_show‘; teach_show.className = ‘dynamic_hide‘; } teach_danamic.onmousemove = function () { teach_show.className = ‘dynamic_show‘; science_show.className = ‘dynamic_hide‘; } }
最后,在 body事件中回调即可:
<body onload="set_danamic()">
标签:
原文地址:http://www.cnblogs.com/listened/p/4214704.html