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


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
Dec 23 PHP
基于PHP的简单采集数据入库程序【续篇】
Jul 30 PHP
php中call_user_func函数使用注意事项
Nov 21 PHP
PHP清除字符串中所有无用标签的方法
Dec 01 PHP
PHP封装的HttpClient类用法实例
Jun 17 PHP
php similar_text()函数的定义和用法
May 12 PHP
PHP自定义函数格式化json数据示例
Sep 14 PHP
thinkPHP框架可添加js事件的分页类customPage.class.php完整实例
Mar 16 PHP
php 人员权限管理(RBAC)实例(推荐)
May 24 PHP
phpcms配置列表页以及获得文章发布时间
Jul 04 PHP
Laravel用户授权系统的使用方法示例
Sep 16 PHP
浅析php如何实现爬取数据原理
Sep 27 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
thinkphp的c方法使用示例
2014/02/24 PHP
ThinkPHP中redirect用法分析
2014/12/05 PHP
php htmlentities()函数的定义和用法
2016/05/13 PHP
JavaScript 解析读取XML文档 实例代码
2009/07/07 Javascript
jquery ajax 登录验证实现代码
2009/09/23 Javascript
JavaScript DOM 学习第五章 表单简介
2010/02/19 Javascript
js登录弹出层特效
2014/03/07 Javascript
document.compatMode的CSS1compat使用介绍
2014/04/03 Javascript
js对象内部访问this修饰的成员函数示例
2014/04/27 Javascript
jQuery实现动态添加和删除一个div
2015/08/12 Javascript
整理Javascript基础语法学习笔记
2015/11/29 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
2016/06/21 Javascript
JS控制静态页面传递参数并获取参数应用
2016/08/10 Javascript
微信小程序实战之上拉(分页加载)效果(2)
2017/04/17 Javascript
vue router路由嵌套不显示问题的解决方法
2017/06/17 Javascript
微信小程序实现团购或秒杀批量倒计时
2020/11/01 Javascript
vue项目出现页面空白的解决方案
2019/10/31 Javascript
JavaScript实现简单贪吃蛇效果
2020/03/09 Javascript
jquery+ajax实现异步上传文件显示进度条
2020/08/17 jQuery
Vue-router编程式导航的两种实现代码
2021/03/04 Vue.js
[11:33]DAC2018 4.5SOLO赛决赛 MidOne vs Paparazi第二场
2018/04/06 DOTA
python Django连接MySQL数据库做增删改查
2013/11/07 Python
一个月入门Python爬虫学习,轻松爬取大规模数据
2018/01/03 Python
PyCharm安装第三方库如Requests的图文教程
2018/05/18 Python
python抓取京东小米8手机配置信息
2018/11/13 Python
python 从文件夹抽取图片另存的方法
2018/12/04 Python
python生成13位或16位时间戳以及反向解析时间戳的实例
2020/03/03 Python
基于HTML5+Webkit实现树叶飘落动画
2017/12/28 HTML / CSS
一些Unix笔试题和面试题
2013/01/22 面试题
电子商务网站的创业计划书
2014/01/05 职场文书
代理班主任的自我评价
2014/02/04 职场文书
2014年安全生产大检查方案
2014/05/13 职场文书
四风问题对照检查材料整改措施
2014/09/27 职场文书
2014年节能减排工作总结
2014/12/06 职场文书
会计岗位职责
2015/02/03 职场文书
2016年优秀党务工作者先进事迹材料
2016/02/29 职场文书