- 浏览: 721691 次
- 性别:
- 来自: 广州
文章分类
最新评论
-
ron.luo:
群主有开放源代码吗?
统一用户权限管理系统(正式版) -
名字应该取长点:
楼主可不可以问你几个问题呀,关于这个插件,貌似单线程,而且不分 ...
Extjs3.3 + swfUpload2.2 实现多文件上传组件 -
mayouth:
不知道楼主能不能解决下浏览器兼容的问题,目前好像火狐和谷歌浏览 ...
Extjs3.3 + swfUpload2.2 实现多文件上传组件 -
一水无间:
...
pushlet + Extjs 聊天室v0.9 (含源码) -
jintt123:
你好!我后台用的是C#,为什么一直上传失败,好像是后台取不到参 ...
多文件上传UploadPanel for extjs4(swfuoload2.5)
效果:
使用的图标:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>CPM案件池待办</title> <link rel="icon" href="<%=request.getContextPath()%>/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="<%=request.getContextPath()%>/favicon.ico" type="image/x-icon" /> <link rel="bookmark" href="<%=request.getContextPath()%>/favicon.ico" type="image/x-icon" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta id="author" content="skywin" /> <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/view/pacTask/resource/common.css" /> <script type="text/javascript" src="<%=request.getContextPath()%>/view/pacTask/pactaskcommon.js"></script> <script type="text/javascript" src="<%=request.getContextPath()%>/view/pacTask/todoPage.js"></script> <style type="text/css"> body{ font-size : 12px; background: #F6FAFF; height : 100%; } .labeltd{ text-align : right; width : 115px; } fieldset{ padding:5px; } fieldset legend{ font-weight : bold; cursor : hand; cursor : pointer; } .panel-t{ width: 100%; } .panel-t input,textarea{ width : 100%; border : 1px solid #CCCC99; } .t-tool { background: url("resource/images/tool-sprites.gif") no-repeat scroll 0 0 transparent; cursor: pointer; float: left; height: 15px; margin-left: 2px; overflow: hidden; width: 15px; } .t-tool-toggle { background-position: 0 -75px; } .t-tool-toggle2 { background-position: 0 -60px; } </style> </head> <body> <div id="loading-mask" style="width:100%;height:100%;background:#f1f1f1;position:absolute;z-index:20000;left:0;top:0;"> </div> <div id="loading"> <div class="loading-indicator"> <div>欢迎使用</div> <img src="<%=request.getContextPath()%>/lib/ext/resources/images/default/grid/wait.gif" width="18" height="18" style="margin-right:5px;" align="absmiddle"/> <span id="load-status" style="font-weight : normal;">正在加载数据,请稍候...</span> </div> </div> <div style="margin:70px;"> <!-- 基本信息 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>基本信息</legend> <table cellPadding="1" cellSpacing="1" border="0" class="panel-t"> <tr> <td class="labeltd">纠纷案件名称:</td> <td colSpan="5" ><input type="text" id="caseName" /></td> </tr> <tr> <td class="labeltd">案件号:</td> <td colSpan="5" ><input type="text" id="caseNumber" /></td> </tr> <tr> <td class="labeltd">法律风险控制点:</td> <td colSpan="5" ><textarea id="lawRiskName" rows="5" ></textarea><td> </tr> <tr> <td class="labeltd">其他法律风险点:</td> <td colSpan="5" ><input type="text" id="otherLawRisk" /></td> </tr> <tr> <td class="labeltd">案件处理公司:</td> <td colSpan="3"><input type="text" id="caseCompany" /></td> <td class="labeltd">案件性质:</td> <td><input type="text" id="caseKind"/></td> </tr> <tr> <td class="labeltd">案件关键字:</td> <td colSpan="5" ><textarea rows="5" id="caseKeyWord"></textarea></td> </tr> <tr> <td class="labeltd">是否公开:</td> <td><input type="text" id="isOpen"/></td> <td class="labeltd">公司是否原告:</td> <td><input type="text" id="isPlaintiff"/></td> <td class="labeltd">是否反黑联盟案件:</td> <td><input type="text" id="union"/></td> </tr> <tr> <td class="labeltd">案件状态:</td> <td><input type="text" id="caseStatus"/></td> <td class="labeltd">号码归属地:</td> <td><input type="text" id="numCity"/></td> <td class="labeltd">主审法官:</td> <td><input type="text" id="judeg"/></td> </tr> <tr> <td class="labeltd">标的金额:</td> <td><input type="text" id="amount"/></td> <td class="labeltd">处理人员:</td> <td><input type="text" id="caseOwner"/></td> </tr> </table> </fieldset> <!-- 案件资料 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>案件资料</legend> <table border=1 cellPadding=0 cellSpacing=0 style="margin:5px;width:840px;"> <tr><th width="40px" style="text-align:center;">序号</th><th width="480px" style="text-align:center;">名称</th><th width="90px" style="text-align:center;">分类</th><th width="160px" style="text-align:center;">上传时间</th><th width="70px" style="text-align:center;"> </th></tr> <tbody id="case_files"> </tbody> </table> </fieldset> <!-- 一审信息 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>一审信息</legend> <table cellPadding="1" cellSpacing="1" border="0" class="panel-t"> <tr> <td class="labeltd">原告(申请人):</td> <td><input type="text" id="plaintiff"/></td> <td class="labeltd">被告(被申请人):</td> <td><input type="text" id="defendant"/></td> <td class="labeltd">第三人:</td> <td><input type="text" id="third"/></td> </tr> <tr> <td class="labeltd">发生时间:</td> <td><input type="text" id="beginDate"/></td> <td class="labeltd">终止时间:</td> <td><input type="text" id="endDate"/></td> </tr> <tr> <td class="labeltd">业务领域:</td> <td><input type="text" id="businessField"/></td> <td class="labeltd">案由:</td> <td><input type="text" id="coa" /></td> </tr> <tr> <td class="labeltd">案情简介:</td> <td colSpan="5" ><textarea rows="5" id="caseDesc" ></textarea></td> </tr> <tr> <td class="labeltd">诉讼请求:</td> <td colSpan="5" ><textarea rows="5" id="claims" ></textarea></td> </tr> <tr> <td class="labeltd">应诉方案:</td> <td colSpan="5" ><textarea rows="5" id="respond" ></textarea></td> </tr> <tr> <td class="labeltd">处理方式:</td> <td><input type="text" id="actionType"/></td> <td class="labeltd">一审处理机构/机关:</td> <td><input type="text" id="court"/></td> <td class="labeltd">处理结果:</td> <td><input type="text" id="handleResult" /></td> </tr> <tr> <td class="labeltd">生效法律文书目录:</td> <td colSpan="5" ><textarea rows="5" id="lawDir"></textarea></td> </tr> </table> </fieldset> <!-- 二审信息 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>二审信息</legend> <table cellPadding="1" cellSpacing="1" border="0" class="panel-t"> <tr> <td class="labeltd">是否进行二审:</td> <td><input type="text" id="retrial"/></td> </tr> <tr> <td class="labeltd">二审诉求:</td> <td colSpan="5" ><textarea rows="5" id="claims2"></textarea></td> </tr> <tr> <td class="labeltd">二审处理机构/机关:</td> <td colSpan="5" ><input type="text" id="court2"/></td> </tr> <tr> <td class="labeltd">二审主审法官:</td> <td><input type="text" id="judeg2"/></td> <td class="labeltd">二审发生时间:</td> <td><input type="text" id="beginDate2"/></td> <td class="labeltd">二审终止时间:</td> <td><input type="text" id="endDate2"/></td> </tr> <tr> <td class="labeltd">处理人员:</td> <td><input type="text" id="caseOwner2"/></td> <td class="labeltd">处理结果:</td> <td><input type="text" id="handleResult2"/></td> </tr> <tr> <td class="labeltd">二审生效法律文书目录:</td> <td colSpan="5" ><textarea rows="5" id="lawDir2"></textarea></td> </tr> <tr> <td class="labeltd">案件分析及相关法律建议:</td> <td colSpan="5" ><textarea rows="5" id="suggest"></textarea></td> </tr> <tr> <td class="labeltd">备注:</td> <td colSpan="5" ><textarea rows="5" id="memo"></textarea></td> </tr> </table> </fieldset> <!-- 再审或重审 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>再审或重审</legend> <table cellPadding="1" cellSpacing="1" border="0" class="panel-t"> <tr> <td class="labeltd">是否进行再审重审:<br /></td> <td><input type="text" id="retrial3"/><br /></td> </tr> <tr> <td class="labeltd">诉求:<br /></td> <td colSpan="5" ><textarea rows="5" id="claims3"></textarea><br /></td> </tr> <tr> <td class="labeltd">处理机构/机关:<br /></td> <td colSpan="5" ><input type="text" id="court3" /><br /></td> </tr> <tr> <td class="labeltd">主审法官:<br /></td> <td><input type="text" id="judeg3"/><br /></td> <td class="labeltd">发生时间:<br /></td> <td><input type="text" id="beginDate3"/><br /></td> <td class="labeltd">终止时间:<br /></td> <td><input type="text" id="endDate3"/><br /></td> </tr> <tr> <td class="labeltd">处理人员:<br /></td> <td><input type="text" id="caseOwner3"/><br /></td> <td class="labeltd">处理结果:<br /></td> <td><input type="text" id="handleResult3"/><br /></td> </tr> <tr> <td class="labeltd">生效法律文书目录:<br /></td> <td colSpan="5" ><textarea rows="5" id="lawDir3"></textarea><br /></td> </tr> <tr> <td class="labeltd">案件分析及相关法律建议:<br /></td> <td colSpan="5" ><textarea rows="5" id="suggest3"></textarea><br /></td> </tr> <tr> <td class="labeltd">备注:<br /></td> <td colSpan="5" ><textarea rows="5" id="memo3"></textarea><br /></td> </tr> </table> </fieldset> <!-- 流程进度 --> <fieldset> <legend><em class="t-tool t-tool-toggle"> </em>流程进度</legend> <table> <tr></tr> </table> </fieldset> </div> </body> </html>
代码片段:
/** * 折叠 */ function initToggle(){ var legends = document.getElementsByTagName('legend'); for(var i=0,len=legends.length;i<len;i++){ legends[i].onclick = function(){ for(var j=0,ln=this.parentElement.childNodes.length;j<ln;j++){ var nodeName = this.parentElement.childNodes[j].nodeName; if(nodeName&&nodeName.toUpperCase() === 'TABLE'){//兼容浏览器,有的浏览器childNodes的个数不同 var tbl = this.parentElement.childNodes[j]; if(tbl.style.display === 'none'){ tbl.style.display = 'block'; this.childNodes[0].className= 't-tool t-tool-toggle'; }else { tbl.style.display = 'none'; this.childNodes[0].className= 't-tool t-tool-toggle2'; } } } } } /** * 初始化折叠起 * @type Number */ for(var i=2,len=legends.length-1;i<len;i++){//init for(var j=0,ln=legends[i].parentElement.childNodes.length;j<ln;j++){ var nodeName = legends[i].parentElement.childNodes[j].nodeName; if(nodeName&&nodeName.toUpperCase() === 'TABLE'){//兼容浏览器,有的浏览器childNodes的个数不同 var tbl = legends[i].parentElement.childNodes[j]; tbl.style.display = 'none'; legends[i].childNodes[0].className= 't-tool t-tool-toggle2'; } } } }
发表评论
-
webDesktop for jquery (支持IE6+,firefox,chrome,Opera)
2013-03-25 23:29 2019网上有很多类似的webDesktop,但对ie6不支持,所 ... -
通过document.createAttribute设置文本框文本域只读
2012-04-26 13:39 2486代码片段: var input = document.get ... -
尽量不要使用document.getElementsByTagName,用document.getElementById代替
2012-04-26 13:36 14487document.getElementsByTagName() ... -
使用createDocumentFragment不要使用innerHTML
2012-04-26 13:22 8307借助createDocumentFragment创建的tabl ... -
ajax 封装(备忘)
2012-04-12 12:57 1305function openLink(o){ var ... -
javascript 事件列表
2012-04-07 00:26 1165javascript 事件列表: -
javaScript DOM方法与属性摘要
2012-04-07 00:10 11291 createElement(element) 创 ... -
JavaScript CSS Style属性对照表
2012-04-06 23:34 1210使用方法: document.getElementById( ... -
使用Raphael 画图(四) 路径(一) (javascript)
2010-11-21 23:49 8388这章介绍路径,本人觉得这是比较难和精髓的一部分。 先介 ... -
使用Raphael 画图(三) 事件 (javascript)
2010-11-21 22:56 6842这章展示事件例子。 下图是官方API的事件: ... -
使用Raphael 画图(二) 扩展的图形 (javascript)
2010-11-21 18:18 7989看这文章前,建议先看第一编文章《使用Raphael 画图(一) ... -
使用Raphael 画图(一) 基本图形 (javascript)
2010-11-21 16:34 9973Raphael是什么?自己百度一下吧。 Raphael对主流 ...
相关推荐
今天我们将深入探讨如何利用JavaScript(简称JS)和CSS3技术实现一个可收缩展开的右侧边导航菜单。这份代码资源——"js+css3网页右侧边收缩展开导航菜单代码.zip",提供了完整的实现方案,包括HTML结构、CSS样式和...
标题中的“jQuery+CSS3风琴折叠图片效果”是指一种网页交互设计,它结合了JavaScript库jQuery和CSS3的技术,创造出一种类似手风琴展开和折叠的动态视觉效果。这种效果通常用于展示多张图片,当用户点击某一张图片时...
HTML5和CSS3是现代网页开发的两大核心技术,它们提供了丰富的功能和强大的表现力,使得网页设计更加生动、交互性更强。在这个主题中,“9种html5+css3隐藏侧边栏导航菜单动画效果”主要关注的是如何利用这两门技术来...
在网页设计和开发中,创建一个可伸展和...在项目文件"scrollerbar"中,可能包含了HTML结构、CSS样式和JavaScript脚本,它们共同协作以实现这个功能。对于初学者和经验丰富的开发者来说,这是一个很好的学习和实践案例。
例如,在手风琴特效中,jQuery的滑动(slide)函数可以用于创建元素的展开和收缩效果,使得内容以平滑的方式显示或隐藏。 接着是CSS3,它是CSS的最新版本,引入了许多新的样式属性和功能,如选择器、过渡...
"div+css"是创建这种导航菜单的常见方法,而JavaScript(JS)则常用于添加交互性,如下拉菜单和树状结构,使得菜单可以展开和收缩,提升用户体验。以下是对这些技术的详细讲解: 1. **Div与CSS**: - **Div**:在...
为了实现“右侧折叠”效果,我们可能需要一个初始隐藏的导航菜单,通过CSS的`display`或`opacity`属性来控制。在jQuery事件处理程序中,点击触发器可以改变这些属性,使得菜单逐渐可见并滑动到屏幕左侧。同时,为...
CSS+JS 实现 DIV 层的展开折叠效果 本文将详细介绍如何使用 CSS 和 JS 实现一个 DIV 层的展开折叠效果。这个效果可以在网页上实现一个折叠的样式,用户可以点击按钮来展开或折叠内容。 HTML 结构 首先,我们需要...
本资源集合了近50种不同的伸缩滑动折叠菜单,这些菜单利用JavaScript、CSS以及HTML的div元素来实现,对于前端开发者来说具有极高的学习和参考价值。下面我们将详细探讨这些技术及其在菜单设计中的应用。 1. ...
在网页中,树形目录通过HTML元素如`<ul>`和`<li>`来构建,利用CSS进行样式控制,而JavaScript则负责处理用户的交互,如点击节点时的展开和收缩效果。 **JavaScript** 是一种运行在浏览器端的脚本语言,用于增加网页...
"jQuery+CSS3手风琴展开导航菜单代码"是一个实用的解决方案,它结合了jQuery的动态效果和CSS3的样式功能,以创建交互性强、用户体验良好的折叠式导航菜单。下面我们将详细探讨这个代码实现的知识点。 首先,`jQuery...
【标题】"仿京东商城分类效果(纯js+css)" 涉及的主要知识点是前端开发中的JavaScript和CSS技术,用于实现动态交互的商城分类菜单。这种效果通常包括了菜单的折叠、展开、鼠标悬停响应等交互功能,旨在提供用户友好...
CSS层折叠(或收缩)与展开特效; CSS高度自适应代码(用了都说好); JavaScript密码强度检测代码; JavaScript判断输入框中是否包含中文; JavaScript判断远程图片是否存在; Js+Css图片切换,带缩略图响应鼠标滑过; JS...
在网页设计中,JavaScript、HTML、CSS以及Frame和Frameset框架的整合是构建交互式、动态网站的关键技术。本文将详细解析这些技术如何协同工作,创建出一个具有可收缩左侧菜单和并排子菜单的框架结构。 首先,HTML...
"基于CSS+JavaScript实现的很漂亮的CSS逼真仿XP系统折叠菜单"是一个出色的技术实践,它允许开发者模仿Windows XP操作系统中的经典菜单样式,为网页增添一种熟悉且舒适的用户体验。这个项目将CSS(层叠样式表)与...
在IT领域,JavaScript(简称JS)和CSS3是前端开发中的关键工具,它们共同负责创建交互性和视觉吸引力的网页元素。本项目“js+css3实现的蓝色手风琴图标菜单特效源码”是一个利用这两种技术实现的动态菜单效果,特别...
在本例中,CSS3被用来实现平滑的过渡效果,当用户触摸屏幕时,菜单项会优雅地展开或收缩,同时保持流畅的动画性能,确保在各种移动设备上都能有良好的表现。 资源中包含的文件“132686896148388609”很可能是实现这...
CSS层折叠(或收缩)与展开特效; CSS高度自适应代码(用了都说好); JavaScript密码强度检测代码; JavaScript判断输入框中是否包含中文; JavaScript判断远程图片是否存在; Js+Css图片切换,带缩略图响应鼠标滑过; JS...
在网页设计中,CSS(Cascading Style Sheets)和JavaScript(JS)经常被用来实现丰富的交互效果,其中层的折叠和展开特效就是一种常见的应用场景。这些特效主要用于优化用户体验,通过控制内容的可见性,使用户可以...