- 浏览: 2286928 次
- 性别:
- 来自: 成都
文章分类
- 全部博客 (357)
- J2EE (49)
- JavaScript (40)
- Spring (19)
- Struts (5)
- CSS (8)
- Hibernate (16)
- Java (67)
- DWR (4)
- JSON (3)
- XFIRE (1)
- Tomcat (1)
- Ant (2)
- 设计模式 (2)
- 经典收藏 (2)
- JSP (10)
- Linux (0)
- WebLogic (11)
- myeclipse (13)
- Buffalo (4)
- 文件上传相关 (1)
- oracle (33)
- html (6)
- JSTL (3)
- SVN (2)
- GIT (1)
- 孙卫琴(Java网络编程精解) (1)
- DOM4J (2)
- Swing (1)
- AJAX (1)
- Eclipse (5)
- 日志组件 (3)
- PowerDesigner (1)
- Jquery (22)
- IT技术开发相关网址 (1)
- Nutz (1)
- 其它 (1)
- Velocity (3)
- WebService (1)
- MySql (2)
- Android (1)
- Maven (2)
- Quartz (11)
- Lucene (1)
- springsource (1)
- Junit (1)
- Activiti (0)
最新评论
-
yzlseu:
拼凑,没有营养
Activiti进阶—分配组任务 -
zhangsenhao:
非常赞!代码很清楚
SpringMVC3.0+MyIbatis3.0(分页示例) -
xiamw2000:
分页写得不对,应该是 : order by ${orderNa ...
SpringMVC3.0+MyIbatis3.0(分页示例) -
sheertewtw:
...
SpringMVC:上传与下载 -
kingtoon:
...
XSS之xssprotect
jQuery W3C文档
http://www.w3school.com.cn/jquery/index.asp
从零开始学习jQuery(4)-使用jQuery操作元素的属性与样式
http://www.cnblogs.com/tinawan/archive/2010/11/10/1874065.html
从零开始学习jQuery(3)-jQuery包装集
http://www.cnblogs.com/tinawan/archive/2010/11/10/1873837.html
jQuery 拥有三种用于 CSS 操作的重要函数:
$(selector).css(name,value)
$(selector).css({properties})
$(selector).css(name)
具体代码如下:
CSS
jQuery
HTML
http://www.w3school.com.cn/jquery/index.asp
从零开始学习jQuery(4)-使用jQuery操作元素的属性与样式
http://www.cnblogs.com/tinawan/archive/2010/11/10/1874065.html
从零开始学习jQuery(3)-jQuery包装集
http://www.cnblogs.com/tinawan/archive/2010/11/10/1873837.html
jQuery 拥有三种用于 CSS 操作的重要函数:
$(selector).css(name,value)
$(selector).css({properties})
$(selector).css(name)
具体代码如下:
CSS
<style type="text/css"> .panel { margin-left:25%; margin-top:5%; padding: 60px; background-color: red; color: #FFFFFF; font-size:50px; font-weight: bold; width: 600px; text-align:center; } .foo{ background-color:lime; border: 13px solid #345355; } .divClick{ margin-left:25%; margin-top:5%; padding: 60px; background-color: green; color: #000000; font-size:50px; font-weight: bold; width: 600px; text-align:left; } input{ margin-left:25%; margin-top:10px; } </style>
jQuery
<script src="../scripts/jquery-1.6.2.min.js" type="text/javascript"></script> <script type="text/javascript" > $(function(){ //如有多个可:eq(1)... //元素选择器 /* $("input:button").eq(0).bind("click",function(){ $(".panel").addClass("divClick"); }); $("input:button").eq(1).bind("click",function(){ $(".panel").toggleClass("divClick"); }); $("input:button").eq(2).bind("click",function(){ $(".panel").removeClass("divClick"); }); */ $("input:button").eq(0).bind("click",function(){ //加上div提高访问速度 $("div.panel").addClass("divClick"); //$(".panel").addClass("divClick"); }).end()//返回所有按钮 .eq(1).click(function(){//绑定第一个按钮事件 $("div.panel").toggleClass("divClick"); }).end().eq(2).click(function(){ $("div.panel").removeClass("divClick"); }).end().eq(3).click(function(){ $("div.panel").removeClass(); }).end().eq(4).click(function(){ $("div").eq(0).addClass("panel"); }).end().eq(5).click(function (){ $("div.panel").css("display","none"); }).end().eq(6).click(function(){ $("div.panel").css("display",""); // $("div.panel").css("display","block"); }).end().eq(7).click(function(){ $("div.panel").addClass("foo"); }).end().eq(8).click(function(){ $("div.panel").append("是否有clsass属性(foo): " + $("div.panel").hasClass('foo')); }).end().eq(9).click(function(){ $("div.panel").css({"background-color":"#546456","font-size":"200%"}); }).end().eq(10).click(function(){ alert($("div.panel").css("background-color")); }); }); </script>
HTML
<div class="panel">welcome to jQuery!</div> <input type="button" value="改变div的样式" /><br> <input type="button" value="切换div的样式" /><br> <input type="button" value="删除div的样式(divClick)" /><br> <input type="button" value="删除div的所有样式" /><br> <input type="button" value="添加div的样式(panel)" /><br> <input type="button" value="设置div的css的隐藏" /><br> <input type="button" value="设置div的css的显示" /><br> <input type="button" value="添加div的第二个Class属性(foo)" /><br> <input type="button" value="检查div的是否有Class属性(foo)" /><br> <input type="button" value="设置div的css属性:json方式" /><br> <input type="button" value="获取div的css属性:$(selector).css(name)方式" /><br>
发表评论
-
jQuery图表(jqPlot,Highcharts)
2012-05-18 00:48 23546jQuery图表在http://www.oschina.net ... -
jQuery之Ztree
2011-10-19 17:14 17579参考资料 1 spring+struts2+hibernate ... -
jQuery之弹出层(用于提示)
2011-10-19 10:26 2287参考了权威指南的部分代码 实现效果:单击按钮显示层,在单击就 ... -
jQuery之get(txt,xml,json二点注意事项)
2011-10-18 14:42 5707参考资料 1 jQuery ajax - get() 方法 h ... -
jQuery之load
2011-10-17 15:33 7771参考资料 1 jQuery ajax - load() 方法 ... -
jQuery之ID选择器
2011-08-23 15:25 9897参考资料 强烈推荐:张子秋 从零开始学习jQuery (二) ... -
jQuery之effect(效果)
2011-08-23 14:59 2606参考资料 从零开始学习jQuery (7) jQuery动画- ... -
jQuery之select
2011-08-22 16:39 2354话不多说,详见代码吧 网页代码 <div style ... -
jQuery之实战(checkbox,table)
2011-08-19 16:22 3819实现功能如下:参考图片 1 页面加载时效果 2 全选效果 ... -
jQuery之table(隔行变色)
2011-08-19 15:52 2774页面代码如下: <table style=&quo ... -
jQuery之checkbox(复选框)
2011-08-18 17:06 2101业务需求:经常在用户登记中有这样的东西,只选择其中一项或者多项 ... -
jQuery之radio(单选)
2011-08-18 15:41 2459页面代码如下: <inpu ... -
jQuery之get(val,text,html)
2011-08-18 14:53 6046参考资料 1 jquery中,html、val与text三者属 ... -
jQuery之ID选择器
2011-08-18 13:58 16参考资料 强烈推荐:张子秋 从零开始学习jQuery (二) ... -
jQuery之jqzoom(图片放大镜插件)
2011-08-18 11:07 19731参考资料 1 基于jQuery开发的图片放大镜插件 - 淘宝网 ... -
jQuery之DOM
2011-08-17 14:45 1475参考资料 1 跳蚤的小窝:)jQuery对象和DOM对象【jQ ... -
jQuery之入门(ready)
2011-08-17 11:46 2115参考资料 1 jquery $(document).ready ... -
jQuery与Java实现图片的剪切
2011-08-05 15:10 30498一 参考资料 1 jquery Jcrop 头像,logo截图 ... -
jQueryAPI 中文版及相关参考资料
2010-12-24 12:52 2042转载: http://www.css88.com/catego ... -
jQuery对象和DOM对象【jQuery开发注意点(一)】
2010-12-23 16:45 2660转载:jQuery对象和DOM对象【jQuery开发注意点(一 ...
相关推荐
**jQuery+CSS流程图插件详解** 在网页开发中,流程图是一种常见且重要的可视化工具,用于展示逻辑步骤或工作流程。"jQuery+css 实现的单分支流程图插件"是一个利用JavaScript库jQuery和CSS样式来创建简单、动态流程...
jQuery+CSS3做出IOS解锁屏幕特效.rar jQuery+CSS3做出IOS解锁屏幕特效.rar jQuery+CSS3做出IOS解锁屏幕特效.rar jQuery+CSS3做出IOS解锁屏幕特效.rar jQuery+CSS3做出IOS解锁屏幕特效.rar jQuery+CSS3做出IOS解锁...
jQuery+CSS3实现动画相册代码.rar jQuery+CSS3实现动画相册代码.rar jQuery+CSS3实现动画相册代码.rar jQuery+CSS3实现动画相册代码.rar jQuery+CSS3实现动画相册代码.rar jQuery+CSS3实现动画相册代码.rar jQuery+...
jquery css
2. jquery+css五屏焦点图淡入淡出+圆形按钮切换广告图片代码 3. jQuery+CSS实用图片收缩与放大效果插件 4. jquery+div实现同时滑动切换的图文展示特效插件下载 5. jquery+div带动画按钮图片手动与自动切换的...
10个漂亮登录页面,jquery+css310个漂亮登录页面,jquery+css310个漂亮登录页面,jquery+css310个漂亮登录页面,jquery+css310个漂亮登录页面,jquery+css310个漂亮登录页面,jquery+css3
简洁时尚的jQuery和CSS3侧边栏菜单插件.rar 简洁时尚的jQuery和CSS3侧边栏菜单插件.rar 简洁时尚的jQuery和CSS3侧边栏菜单插件.rar 简洁时尚的jQuery和CSS3侧边栏菜单插件.rar 简洁时尚的jQuery和CSS3侧边栏菜单插件...
在本项目中,“jQuery官网CSS样式复刻”是一项旨在重现jQuery官方网站前端界面样式的实践任务。这个任务主要涉及五个核心技术领域:jQuery、CSS、JavaScript(包括ECMAScript)、HTML以及网页资源管理。下面我们将...
通过整合jQuery和CSS3的力量,开发者可以创建出既美观又实用的表单,提升用户在网站上的体验。无论是用于登录注册、搜索查询还是联系方式提交,这种美化方式都能让表单成为网页设计中的亮点,增加用户满意度。同时,...
【标题】中的"W3school"、"jquery"、"jquerymobile"和"css"都是Web开发中的关键元素,它们代表了不同的技术栈和框架。以下是对这些知识点的详细阐述: **W3School**:这是一个非常知名的在线学习平台,提供丰富的...
【jQuery + CSS3 圆角动画导航】 在网页设计中,导航栏是用户与网站交互的重要部分,良好的导航设计能够提升用户体验。本示例“jquery+css3圆角动画导航”利用了JavaScript库jQuery和CSS3的新特性,为网页创建了一...
**jQuery和CSS3文章标题动画特效详解** 在网页设计中,动态效果往往能吸引用户的注意力,提高用户体验。本文将深入探讨如何使用jQuery和CSS3来创建丰富多样的文章标题动画特效,包括打印机效果、翻转效果、翻牌效果...
在网页设计和开发中,创建吸引用户的交互效果是至关重要的,而"Jquery+css3实现弹出层注册特效"就是一个实现这种效果的例子。这个项目结合了jQuery库的灵活性和CSS3的新特性,以创建一个动态且用户友好的注册表单。 ...
在移动应用开发中,jQuery Mobile 和 CSS3 是两个非常重要的技术。jQuery Mobile 是一个轻量级的框架,专为触摸设备设计,它提供了一套完整的组件和交互模式,包括表单、页面布局和按钮样式等。CSS3 则是新一代的CSS...
本项目利用jQuery库、CSS3动画以及HTML5的Audio API来创建一个交互式的音量调节功能。以下是对这个项目的详细解析: 首先,jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。在这...
在本文中,我们将深入探讨如何使用jQuery和CSS3来创建一款圆形布局的卡牌滑动切换特效。这个特效适用于各种项目,例如展示产品、图片库或者动态内容展示,通过点击卡牌实现平滑的切换效果,给用户带来独特的交互体验...
html5 开发 jquery.mobile.theme-1.4.5.min.css 样式表
《jQuery+CSS3多功能弹出层插件v2.0.1详解》 在Web开发中,弹出层(也称为对话框或模态窗口)是不可或缺的元素,它们用于显示重要的信息、提示用户确认操作或者提供交互式内容。本文将深入探讨一款名为“20种弹出层...
jquery变换css样式,jquery方法
【jQuery和CSS3炫酷图片3D旋转幻灯片特效】是现代网页设计中一种吸引用户注意力的交互式元素,通常用于产品展示、图片画廊或动态内容展示。这种特效结合了JavaScript库jQuery和CSS3的新特性,为用户提供了一种三维...