鼠标事件改变表格高度加上平滑过渡效果 - JavaScript论坛 - 编程论坛

| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛 |

编程论坛 → WEB开发 → 『 JavaScript论坛』 → 鼠标事件改变表格高度加上平滑过渡效果

我的收件箱(0)

欢迎加入我们，一同切磋技术

共有 1235 人关注过本帖

标题：鼠标事件改变表格高度加上平滑过渡效果

只看楼主加入收藏

sjzfls

帅哥哟，离线，有人找我吗？

Rank: 1

等　级：新手上路
帖　子：119
专家分：0
注　册：2007-5-11
结帖率：0

收藏

问题点数：0 回复次数：1

鼠标事件改变表格高度加上平滑过渡效果

下面的代码是一个表格平滑展开,
问能否实现两个(或多个)表格切换呢?

-------------------------------                                  ----------------------------------
点表一                                                           表一
------------------------------         点表一后变成
表二

                                                               ---------------------------------------
                                                                    表二
-------------------------------                               ----------------------------------------

   图1                                                                    图2

即点表一后平滑切换成图2,    点表二后  平滑切换成图1 .

就是类似于折叠菜单的效果.

代码:

<script language="JavaScript">
var act;
function over(){
var h = parseInt(mytd.height);
if (h < 164){
mytd.height = h + 2;
clearTimeout(act);
act = setTimeout('over()', 10);
}
}
function out(){
var h = parseInt(mytd.height);
if (h > 30){
mytd.height = h - 2;
clearTimeout(act);
act = setTimeout('out()', 10);
}
}
</script>
<table width="316" height="30" border="2" cellpadding="0" cellspacing="0" id="mytd" onMouseOver="over()" onMouseOut="out()">
<tr>
<td>无忧脚本 - 风云突变</td>
</tr>
</table>

搜索更多相关主题的帖子: 鼠标　表格　高度　效果　

发帖时间

2008-04-14 11:06

zhulei1978

帅哥哟，离线，有人找我吗？

Rank: 16

Rank: 16

Rank: 16

Rank: 16

等　级：版主
威　望：53
帖　子：1351
专家分：1200
注　册：2006-12-17

收藏

得分:0

程序代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>

 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">

 </HEAD>


 <BODY>
<script language="JavaScript">
var act,act1;
function over(id){
var h = parseInt(id.height);
if (h < 164){
id.height = h + 2;
if(id==mytd){
clearTimeout(act);
act = setTimeout(function(){over(id);},10);
}
else{
clearTimeout(act1);
act1 = setTimeout(function(){over(id);},10);
}
}
}
function out(id){
var h = parseInt(id.height);
if (h > 30){
id.height = h - 2;
if(id==mytd){
clearTimeout(act);
act = setTimeout(function(){out(id);},10);
}
else{
clearTimeout(act1);
act1 = setTimeout(function(){out(id);},10);
}
}
}
</script>
<table width="316" height="30" border="2" cellpadding="0" cellspacing="0" id="mytd" onMouseOver="over(mytd)" onMouseOut="out(mytd)">
<tr>
<td>无忧脚本 - 风云突变</td>
</tr>
</table>


<table width="316" height="30" border="2" cellpadding="0" cellspacing="0" id="mytd1" onMouseOver="over(mytd1)" onMouseOut="out(mytd1)">
<tr>
<td>无忧脚本 - 风云突变</td>
</tr>
</table>

 </BODY>
</HTML>

其实我就是改变社会风气，提高少女素质，刺激电影市道，提高年轻人内涵，玉树临风，风度翩翩的整蛊专家，我名叫古晶，英文名叫JingKoo！

发帖时间

2008-04-21 15:42

快速回复：鼠标事件改变表格高度加上平滑过渡效果

关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有，并保留所有权利。

Powered by Discuz, Processed in 0.045878 second(s), 8 queries.
Copyright©2004-2025, BCCN.NET, All Rights Reserved