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


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 相关文章推荐
基于文本的搜索
Oct 09 PHP
基于OpenCV的PHP图像人脸识别技术
Oct 11 PHP
ThinkPHP采用模块和操作分析
Apr 18 PHP
PHP中文分词的简单实现代码分享
Jul 17 PHP
PHP命名空间(namespace)的动态访问及使用技巧
Aug 18 PHP
smarty内置函数section的用法
Jan 22 PHP
PHP+HTML+JavaScript+Css实现简单爬虫开发
Mar 28 PHP
PHP模板引擎Smarty中变量的使用方法示例
Apr 11 PHP
php while循环控制的简单实例
May 30 PHP
php实现批量修改文件名称的方法
Jul 23 PHP
PHP crc32()函数讲解
Feb 14 PHP
Laravel统一错误处理为JSON的方法介绍
Oct 18 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
用session做客户验证时的注意事项
2006/10/09 PHP
php Notice: Undefined index 错误提示解决方法
2010/08/29 PHP
PHP中explode函数和split函数的区别小结
2016/08/24 PHP
简单的php购物车代码
2020/06/05 PHP
jQuery弹出(alert)select选择的值
2013/04/21 Javascript
js 获取radio按钮值的实例
2013/08/17 Javascript
利用javascript实现web页面中指定区域打印
2013/10/30 Javascript
实例说明为什么不要行内使用javascript
2014/04/18 Javascript
jQuery 获取、设置HTML或TEXT内容的两种方法
2014/05/23 Javascript
jQuery中toggle()函数的使用实例
2015/04/17 Javascript
PassWord输入框代码分享
2016/06/07 Javascript
jQuery实现磁力图片跟随效果完整示例
2016/09/16 Javascript
js获取Get值的方法
2016/09/29 Javascript
angularjs+bootstrap实现自定义分页的实例代码
2017/06/19 Javascript
详解angular 中的自定义指令之详解API
2017/06/20 Javascript
Vue Cli与BootStrap结合实现表格分页功能
2017/08/18 Javascript
React项目动态设置title标题的方法示例
2018/09/26 Javascript
从0到1搭建Element的后台框架的方法步骤
2019/04/10 Javascript
使用preload预加载页面资源时注意事项
2020/02/03 Javascript
vue中父子组件传值,解决钩子函数mounted只运行一次的操作
2020/07/27 Javascript
[00:35]TI7不朽珍藏III——寒冰飞龙不朽展示
2017/07/15 DOTA
python如何把嵌套列表转变成普通列表
2018/03/20 Python
pycharm打开命令行或Terminal的方法
2019/01/16 Python
PyCharm更改字体和界面样式的方法步骤
2019/09/27 Python
布隆过滤器的概述及Python实现方法
2019/12/08 Python
乌克兰电子和家用电器商店:Foxtrot
2019/07/23 全球购物
兰蔻法国官方网站:Lancôme法国
2020/02/22 全球购物
《闻一多先生的说和做》教学反思
2014/04/28 职场文书
经济管理自荐书
2014/06/09 职场文书
人力资源管理毕业生自荐信
2014/06/26 职场文书
推广普通话标语
2014/06/27 职场文书
2015年度环卫处工作总结
2015/07/24 职场文书
大学文艺委员竞选稿
2015/11/19 职场文书
使用Python的开发框架Brownie部署以太坊智能合约
2021/05/28 Python
Python Django模型详解
2021/10/05 Python
Go本地测试解耦任务拆解及沟通详解Go本地测试的思路沟通的重要性总结
2022/06/21 Golang