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()">
时间： 2024-07-28 20:43:46