快精灵印艺坊 您身边的文印专家
广州名片 深圳名片 会员卡 贵宾卡 印刷 设计教程
产品展示 在线订购 会员中心 产品模板 设计指南 在线编辑
 首页 名片设计   CorelDRAW   Illustrator   AuotoCAD   Painter   其他软件   Photoshop   Fireworks   Flash  

 » 彩色名片
 » PVC卡
 » 彩色磁性卡
 » 彩页/画册
 » 个性印务
 » 彩色不干胶
 » 明信片
   » 明信片
   » 彩色书签
   » 门挂
 » 其他产品与服务
   » 创业锦囊
   » 办公用品
     » 信封、信纸
     » 便签纸、斜面纸砖
     » 无碳复印纸
   » 海报
   » 大篇幅印刷
     » KT板
     » 海报
     » 横幅

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

留言版里有太长的留言的话会把页面撑的很长的,大家对那些很长的留言版是不是觉得看的不舒适,每次都要点很多次滚动条。
假如每次一开始只出现标题,点击标题就会在下方出现内容(注重不是弹出窗口),这样的话是不是很不错呢!
接下来我们就看看如何实现:
首先要对各个标题和内容设上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中动态HTML的输出技术
下一教程: 专家预言:PHP将比Java更受欢迎

您可以阅读与"做一个有下拉功能的留言版"相关的教程:
· 做一个信息发布功能
· 一个php作的文本留言本的例子(六)
· 我们常常要处理一些以星期为单位的日期,以下的代码生成一个从当前周开始十个星期的下拉列表。
· 建立文件交换功能的脚本(三)
· 一个没有MYSQL数据库支持的简易留言本的编写
    微笑服务 优质保证 索取样品