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


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下连接mssql2005的代码
Jan 17 PHP
基于curl数据采集之单页面并行采集函数get_htmls的使用
Apr 28 PHP
php中的PHP_EOL换行符详细解析
Oct 26 PHP
PHP输出英文时间日期的安全方法(RFC 1123格式)
Jun 13 PHP
PHP对象递归引用造成内存泄漏分析
Aug 28 PHP
PHP内核探索之变量
Dec 22 PHP
joomla组件开发入门教程
May 04 PHP
PHP使用PHPExcel删除Excel单元格指定列的方法
Jul 06 PHP
php获取今日开始时间和结束时间的方法
Feb 27 PHP
Laravel 5.4.36中session没有保存成功问题的解决
Feb 19 PHP
php微信公众号开发之音乐信息
Oct 20 PHP
PHP实现微信公众号验证Token的示例代码
Dec 16 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
桌面中心(三)修改数据库
2006/10/09 PHP
PHP常用代码
2006/11/23 PHP
PHP常用正则表达式集锦
2014/08/17 PHP
php操作xml入门之xml基本介绍及xml标签元素
2015/01/23 PHP
Thinkphp框架开发移动端接口(2)
2016/08/18 PHP
浅谈PHP发送HTTP请求的几种方式
2017/07/25 PHP
表单的焦点顺序tabindex和对应enter键提交
2013/01/04 Javascript
JS比较2个日期间隔的示例代码
2014/04/15 Javascript
jquery的clone方法应用于textarea和select的bug修复
2014/06/26 Javascript
JavaScript判断一个字符串是否包含指定子字符串的方法
2015/03/18 Javascript
js给selected添加options的方法
2015/05/06 Javascript
Javascript中With语句用法实例
2015/05/14 Javascript
jquery关于事件冒泡和事件委托的技巧及阻止与允许事件冒泡的三种实现方法
2015/11/27 Javascript
基于javascript实现文字无缝滚动效果
2016/03/22 Javascript
浅谈JavaScript函数的四种存在形态
2016/06/08 Javascript
JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)
2016/11/01 Javascript
详解Vue的钩子函数(路由导航守卫、keep-alive、生命周期钩子)
2018/07/24 Javascript
vue 音乐App QQ音乐搜索列表最新接口跨域设置方法
2018/09/25 Javascript
微信小程序下拉框组件使用方法详解
2018/12/28 Javascript
使用webpack搭建vue项目实现脚手架功能
2019/03/15 Javascript
详解在HTTPS 项目中使用百度地图 API
2019/04/26 Javascript
vue实现动态按钮功能
2019/05/13 Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
2019/09/18 Javascript
JS Html转义和反转义(html编码和解码)的实现与使用方法总结
2020/03/10 Javascript
Python爬虫代理IP池实现方法
2017/01/05 Python
numpy返回array中元素的index方法
2018/06/27 Python
用于业余项目的8个优秀Python库
2018/09/21 Python
Python中extend和append的区别讲解
2019/01/24 Python
Python自动生成代码 使用tkinter图形化操作并生成代码框架
2019/09/18 Python
data:image data url 文件转为Blob上传后端的方法
2019/07/16 HTML / CSS
清洁工表扬信
2014/01/08 职场文书
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
婚内房产协议书范本
2014/10/02 职场文书
违纪检讨书范文
2015/01/27 职场文书
教师工作决心书
2015/02/04 职场文书
胡雪岩故居导游词
2015/02/06 职场文书