做一个有下拉功能的留言版


Posted in PHP onOctober 09, 2006

留言版里有太长的留言的话会把页面撑的很长的,大家对那些很长的留言版是不是觉得看的不舒服,每次都要点很多次滚动条。
如果每次一开始只出现标题,点击标题就会在下方出现内容(注意不是弹出窗口),这样的话是不是很不错呢!
接下来我们就看看如何实现:
首先要对各个标题和内容设上ID,这是第一个留言的ID设置,我们把标题的ID设为td1,内容为tdd1,接下去相同。
<TR align=left id=td1 onclick=goit(tdd1) onmouseout=noit(td1) onmouseover=onit(td1) style="CURSOR: hand" bgcolor=#C8E7BA>    
  <td vAlign=middle >这里是标题</TD>

</TR>
<TR>
  <TD class=zw id=tdd1 bgcolor=#fffoce>这里是内容
  <DIV align=right>
<A class=btn href="#tob0" onclick=goit(tdd1)>关闭</A>
  </DIV>
  </TD>
</TR>

"onclick=goit(tdd1) onmouseout=noit(td1) onmouseover=onit(td1)"
这三句就是mouse的事件,noit()和onit()只是改变颜色,goit()就是打开或关闭内容的函数,具体函数在下:

<SCRIPT language="JavaScript">
<!--
function onit(o){o.runtimeStyle.backgroundColor='#FFBB66'}
function noit(o){o.runtimeStyle.backgroundColor='#C8E7BA'}
function goit(o){
if (o.style.display=='none') {
o.style.display=''
}
else {
o.style.display='none'
}
}
-->
</SCRIPT>

最后不要忘了,初始化你的页面,就是把内容先隐藏起来“
<script language="JavaScript">
goit(tdd1);goit(tdd2);…………
</script>

PHP 相关文章推荐
php strstr查找字符串中是否包含某些字符的查找函数
Jun 03 PHP
php管理nginx虚拟主机shell脚本实例
Nov 19 PHP
PHP进程同步代码实例
Feb 12 PHP
php获得网站访问统计信息类Compete API用法实例
Apr 02 PHP
thinkphp3.2.3 分页代码分享
Jul 28 PHP
php实现水印文字和缩略图的方法示例
Dec 29 PHP
PHP文字转图片功能原理与实现方法分析
Aug 31 PHP
PHP调用微博接口实现微博登录的方法示例
Sep 22 PHP
PHP实现的权重算法示例【可用于游戏根据权限来随机物品】
Feb 15 PHP
PHP观察者模式定义与用法实例分析
Mar 22 PHP
PHP快速排序算法实现的原理及代码详解
Apr 03 PHP
PHP设计模式(七)组合模式Composite实例详解【结构型】
May 02 PHP
留言板翻页的实现详解
Oct 09 #PHP
聊天室php&amp;mysql(二)
Oct 09 #PHP
聊天室php&amp;mysql(一)
Oct 09 #PHP
建立文件交换功能的脚本(三)
Oct 09 #PHP
建立文件交换功能的脚本(一)
Oct 09 #PHP
建立文件交换功能的脚本(二)
Oct 09 #PHP
深入了解php4(2)--重访过去
Oct 09 #PHP
You might like
制作美丽的拉花
2021/03/03 冲泡冲煮
javascript 写类方式之十
2009/07/05 Javascript
JavaScript DOM学习第八章 表单错误提示
2010/02/19 Javascript
javascript 基础篇2 数据类型,语句,函数
2012/03/14 Javascript
JS判断元素为数字的奇异写法分享
2012/08/01 Javascript
js限制文本框只能输入整数或者带小数点的数字
2015/04/27 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
2015/07/29 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
2016/04/06 Javascript
Nodejs从有门道无门菜鸟起飞必看教程
2016/07/20 NodeJs
javascript轮播图算法
2016/10/21 Javascript
JavaScript中的this陷阱的最全收集并整理(没有之一)
2017/02/21 Javascript
JS字符串按逗号和回车分隔的方法
2017/04/25 Javascript
浅析vue中常见循环遍历指令的使用 v-for
2018/04/18 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
2018/07/30 Javascript
vuejs 动态添加input框的实例讲解
2018/08/24 Javascript
vue使用better-scroll实现下拉刷新、上拉加载
2018/11/23 Javascript
详解Vue用cmd创建项目
2019/02/12 Javascript
vue项目中将element-ui table表格写成组件的实现代码
2019/06/12 Javascript
[01:47]2018年度DOTA2最佳教练-完美盛典
2018/12/16 DOTA
python使用append合并两个数组的方法
2015/04/28 Python
python实现对excel进行数据剔除操作实例
2017/12/07 Python
对numpy下的轴交换transpose和swapaxes的示例解读
2019/06/26 Python
python中 * 的用法详解
2019/07/10 Python
Tensorflow 卷积的梯度反向传播过程
2020/02/10 Python
python3排序的实例方法
2020/10/20 Python
python进行二次方程式计算的实例讲解
2020/12/06 Python
python FTP编程基础入门
2021/02/27 Python
GoPro摄像机美国官网:美国运动相机厂商
2018/07/03 全球购物
我的珠宝盒:Ma boîte à bijoux
2019/08/27 全球购物
C语言怎样定义和声明全局变量和函数最好
2013/11/26 面试题
生产车间班组长岗位职责
2014/01/06 职场文书
领导检查欢迎词
2014/01/14 职场文书
运动会方阵解说词
2014/02/12 职场文书
python 实现mysql自动增删分区的方法
2021/04/01 Python
Mysql服务添加 iptables防火墙策略的方案
2021/04/29 MySQL
使用Canvas绘制一个游戏人物属性图
2022/03/25 Javascript