- 浏览: 298986 次
- 性别:
- 来自: 杭州
博客专栏
-
Java面试
浏览量:0
文章分类
- 全部博客 (133)
- Struts2 (4)
- Hibernate (2)
- Spring (3)
- Java常识小积累 (18)
- Linux (6)
- Oscache (1)
- 面试技巧 (2)
- Eclipse (4)
- JavaScript (21)
- 生活 (7)
- Mysql (3)
- 网络优秀文章 (1)
- Freemaker (1)
- Tcp和UDP (1)
- ubuntu -java (1)
- Oracle (14)
- 重构 (1)
- webservice (4)
- Lucene (1)
- UML与OOA/D (1)
- 软件杂谈 (2)
- Nosql(Redis) (1)
- 团队开发 (1)
- Oracle 设计 (1)
- velocity (1)
- 面试那些事儿 (1)
- 技术 (1)
- 互联网 (1)
- 数据库 (1)
- jquery (1)
- java (2)
- fastjson (1)
- Remoting (1)
- 算法 (1)
- 学习技巧 (1)
- POI (3)
- FusionCharts (1)
- 学习资源 (1)
- 设计模式 (2)
- CSS (1)
- 技术边缘 (3)
- 生活感想 (0)
- JVM (1)
- JSON (0)
- 前端 (1)
- cxf (1)
- 分布式 (1)
- 阿萨德飞 (0)
- Java面试中的知识 (2)
- redis (1)
- 开发工具使用 (3)
最新评论
-
liushimiao0104:
请问下怎么删除word里面的图片呢
POI向word添加图片,表格 -
chpn:
addBatch确实可以1.这个和复合索引没得毛关系2.in查 ...
mysql 超1亿数据,优化分页查询 -
步青龙:
dagf113225 写道请问,这个mysql执行SQL的花费 ...
mysql 超1亿数据,优化分页查询 -
dagf113225:
请问,这个mysql执行SQL的花费的时间的工具叫什么?谢谢! ...
mysql 超1亿数据,优化分页查询 -
步青龙:
white_crucifix 写道我怎么觉得builder模式 ...
Builder设计模式
根据网上的一个网页稍微修改了一下,第一部分和第二部分效果不同,如果只需要一种效果,删除另外一种的JS即可,第一个是全div背景,第二个是单行背景,特别简单的一个表单样式,原链接
代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>jqueryform</title> <style> body{font-family:Arial, Helvetica, sans-serif;font-size: 13px;} .content,.contentA{padding:10px;width:370px} .left{width:150px;float:left;padding:7px 0px 0px 7px;min-height:24px;} .right{width:200px;float:left;padding:5px;min-height:24px;} .clear{float:none;clear:both;height:0px;} .row{background-color:none;display:block;min-height:32px;} .text{width:190px;} .ruler{width:400px; border-bottom:dashed 1px #dcdcdc;} tr:focus{background-color:#fcfcf0;} td{vertical-align:top;} .over{background-color:#e6e2af;} .out{background-color:none;} </style> <script type="text/javascript" src="jquery.js"></script> <script> $(document).ready(function(){ $('.content .left, .content input, .content textarea, .content select').focus(function(){ $(this).parents('.content').addClass("over"); }).blur(function(){ $(this).parents('.content').removeClass("over"); }); $('.contentA .left, .contentA input, .contentA textarea, .contentA select').focus(function(){ $(this).parents('.row').addClass("over"); }).blur(function(){ $(this).parents('.row').removeClass("over"); }); }); </script> </head> <body> <form method="post"> <div style="float:left; margin-right:20px; width:400px;"> 第一部分 <div class="contentA"> <div class="row"> <div class="left">First name</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Last name</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Email</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Password</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> </div> </div> <div style="float:left; margin-right:20px;"> 第二部分 <div class="content"> <div class="row"> <div class="left">First name</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Last name</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Email</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> <div class="row"> <div class="left">Password</div> <div class="right"><input name="Text1" type="text" class="text" /></div> <div class="clear"></div> </div> </div> </div> </form> </body> </html>
发表评论
-
jquery的幻灯片效果
2013-12-03 10:35 0jquery效果 -
Ajax
2013-11-27 18:30 1151$.ajax({ type: "pos ... -
prototype
2013-01-11 17:34 3156prototype 是什么? 没有接触过或者不知道proto ... -
Javascript 面向对象
2013-01-10 11:26 9931 普通的创建对象方式 常见: 字面量 2 ... -
Javascript 作用域与this的用法
2013-01-10 09:25 15481 现象 <SCRIPT LANGUAGE=&qu ... -
分享一款前端远程调试开发利器Fidder web Debugger
2013-01-08 23:24 2961Fidder web Debugger 是一个前端非常优秀的实 ... -
Javascript 特殊的对象声明与this作用域
2013-01-07 16:54 1540原JS <SCRIPT LANGUAGE=" ... -
Javascript Date的基本特点
2013-01-06 15:21 1776<SCRIPT LANGUAGE="Ja ... -
Javascript Array的一些用法
2013-01-06 10:52 1751<SCRIPT LANGUAGE="J ... -
Javascript Array的基本特点
2013-01-05 15:48 1419<SCRIPT LANGUAGE="JavaS ... -
Javascript Object 用法
2013-01-05 13:13 1841<SCRIPT LANGUAGE="Ja ... -
Javascript 基本概念
2013-01-02 18:54 1222<script type=" ... -
使用Javascript
2013-01-02 17:49 11521 HTML中使用Javascript ,即是客户 ... -
jquery formValdator 插件那些破事儿
2012-08-23 22:18 1294传统验证框架的弊端: 大多的验证框架验证决定是否提交,对于非必 ... -
互联网倒计时应用
2012-06-30 19:07 1194倒计时主要是javascript,刚进页面的时候从服务器取得服 ... -
常用JS 判断总结
2011-12-06 17:37 1262一个输入框一个判断 为空 长度 特殊字符 是否是数字 ... -
js function
2011-05-27 20:54 1691js 的alert() 会阻塞执行。 <script ... -
本地图片效果
2011-01-07 17:07 41JQuery的$("#imgid").at ... -
css圆角效果
2011-01-06 11:09 1273<!DOCTYPE html PUBLIC &qu ... -
一个非常高效的js的trim截取字符串-原生方法-正则表达式
2010-12-30 12:01 2217第一种非常高效的原生方法: <html> ...
相关推荐
标题 "漂亮的jquery 网页各种table 表单等" 提及的是关于使用jQuery来创建美观的网页元素,特别是表格和表单。jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。在网页设计中,...
这个“基于jQuery制作的精美漂亮的(红绿灰色)表单元素集合.zip”文件显然包含了利用jQuery技术创建的一系列美观且功能丰富的表单组件,这些组件可能包括输入框、下拉菜单、复选框、单选按钮等,而且它们可能有不同的...
【jQuery实现的漂亮表单效果】是Web前端开发中一种常见的UI美化技术,它通过结合JavaScript库jQuery,以及CSS样式,使传统的HTML表单呈现出更加美观、友好的用户体验。在这个实例中,主要展示了如何使用jQuery模拟...
1. 易于使用:通过简单的API,开发者可以快速为表单元素添加验证规则。 2. 可扩展性:支持自定义验证方法,满足个性化需求。 3. 强大的错误消息处理:可以自定义错误消息显示方式,如弹窗、提示框等。 4. 动画效果:...
这个项目“jQuery制作非常漂亮主界面”显然关注的是如何利用jQuery来构建美观且用户友好的前端界面。下面我们将深入探讨jQuery在创建出色用户界面中的关键技术和实践。 首先,jQuery的核心特性之一是选择器。它允许...
jQuery作为一个广泛使用的JavaScript库,提供了丰富的功能和简便的API,使得创建动态、交互性强的Web应用变得更加简单。 首先,jQuery的核心特性之一就是其选择器机制,它可以方便地选取DOM元素,这在创建提示框时...
JQuery允许开发者通过类选择器或者ID选择器来定位特定的表单元素,并使用CSS样式进行定制。例如,`$("#myInput").css({"border": "1px solid #ccc", "padding": "5px"})` 这段代码就可以为ID为"myInput"的输入框设置...
这个插件能够将传统的HTML表单元素转化为具有现代感和专业外观的设计,提升用户的交互体验。 **jqTransform的核心功能** 1. **样式覆盖**:jqTransform通过CSS样式覆盖了默认的HTML表单元素样式,如输入框(input)...
1. **jQuery选择器与DOM操作**:jQuery选择器使得选取HTML元素变得简单,例如`$("#id")`选取ID为指定值的元素,`$(".class")`选取所有类名为指定值的元素。在表单向导中,开发者可能使用这些选择器选取各个步骤的...
表单元素可以通过`data-clear-btn="true"`添加清除按钮,提高用户体验。 对于数据绑定和事件处理,jQuery Mobile提供了便捷的方法。通过`<a>`标签的`data-rel="back"`属性可以实现页面间的导航,而`$(document).on...
"50个jquery漂亮实例"这个压缩包文件集合了五十个精心设计的jQuery代码示例,旨在帮助开发者快速理解和掌握jQuery的各种功能和应用场景。 1. **DOM操作**:jQuery提供了简便的DOM选择器,如`$("#id")`选择ID为id的...
本文将详细解析"jQuery漂亮浮动层插件,精美Dialog代码"这一主题,帮助开发者理解和运用此类插件,提升网页交互体验。 首先,让我们了解什么是浮动层(Floating Layer)和Dialog。浮动层通常指的是在网页上弹出的...
6. **交互性**:弹出框可以包含表单元素,让用户进行输入或选择,提供更丰富的互动体验。 总的来说,jQuery弹出框插件极大地丰富了网页的交互设计,使得开发者能够轻松创建出美观且功能强大的提示窗口,提高用户对...
另一个标签“后台HTML模板”再次确认了这个资源是用于构建后台管理系统的网页模板,它可能包含了常见的后台功能元素,如导航菜单、数据表格、表单、图表等。 【压缩包子文件的文件名称列表】 由于提供的列表只有一...
- **自定义内容**:不仅可以显示简单的文本消息,还能包含HTML元素,如图像、链接或按钮,增强交互性。 - **动画效果**:支持多种动画效果,如淡入淡出、滑动等,让对话框的出现和消失更具吸引力。 - **可配置选项...
5. **表单组件**:jQuery Mobile 改进了标准HTML表单元素,如输入框(inputs)、选择器(selects)、多选框(checkboxes)和单选按钮(radio buttons),提供了触摸优化的样式和交互效果。 6. **主题系统**:jQuery...
3. **表单验证**:模版可能包含简单的表单验证功能,如非空检查、邮箱格式验证等,确保用户输入的有效性。 4. **AJAX交互**:如果模版支持,可能会使用AJAX进行无刷新登录,提高页面的流畅度和交互感。 **文件结构*...
在网页设计中,弹出层(也称为模态窗口或对话框)是一种常见的交互元素,用于显示额外的信息、提示用户操作或者进行表单填写等。jQuery作为一个强大的JavaScript库,提供了简便的方式来创建和控制这些弹出层,使得...
在"jquery validate的漂亮css样式验证"这个主题中,我们主要关注的是如何将`jQuery Validate`与CSS样式相结合,以创建一个既功能强大又视觉上吸引人的验证系统。以下是一些关键知识点: 1. **jQuery Validate库的...