jQuery CSS()方法改变CSS样式实例解析
转自:http://www.jbxue.com/article/24588.html
分享一个jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性。其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔。比如要改变链接颜色,可以这样编写代码:
$("#61dh a").css('color','#123456');
//选择器‘$("#61dh a")'表示ID为‘#61dh'的元素下的所有链接。
//.css(‘color','#123456');表示把颜色设为'#123456'
如果需要改变多个样式属性,可先定义属性变量,然后直接赋值给css()方法。
var mycss = {
background: '#EEE',
width: '478px',
margin: '10px 0 0',
padding: '5px 10px',
border: '1px solid #CCC'
};
$("#result").css(divcss);
上述代码先定义了一个CSS样式属性变量“mycss”,类似于建立一个外部CSS文件,之后通过css()方法,把属性赋给ID为'#result'的DIV。
另外jQuery提供的css()方法还可以查看某个元素的css属性值。(www.jbxue.com 脚本学堂)
例如查看链接的颜色,代码如下:
$("#61dh a").css("color")
你会发现,这与第一个例子相似,但是这里只传递一个参数(样式属性)。
最后要介绍的是如何设置鼠标划过后的链接样式(比如: 颜色),需要用到jQuery事件类方法 - hover()。值得注意的是,hover()方法需要定义两个函数,一个是鼠标划过时;另一个是鼠标划过后。具体方法如下:
$("#61dh a").css('color','#123456');
$("#61dh a").hover(function(){
$(this).css('color','#999');
},
function(){
$(this).css('color','#123456');
});
//hover()方法的两个函数使用用逗号分隔
或许聪明的你已经注意到这种方法称不上简洁,呵呵,其实jQuery hover()方法不是用来改变CSS样式的。在实际运用中,建议使用添加/移出CSS的方法来改变鼠标划过的链接样式。
jQuery CSS()方法改变CSS样式实例解析的更多相关文章
- 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式. 要求如下: 点击页面的"更改样式"按钮后, ...
- jQuery.ajax()方法中參数具体解析
前言 在项目开发中,为了实现异步向服务端发起请求,最常常使用的就是jQuery.ajax方法了.刚開始需求比較简单,调用jQuery.ajax方法时要传的參数也就那几个常见的參数:url/data/d ...
- 使用jquey的css()方法改变样式,
$("#tip").css("display","none"); $("#tip").css("display ...
- CSS()方法设置元素样式
使用CSS()方法可以直接设置元素的样式,方法为:css(name,value) $(p).css("font-weight", "bold"); // ...
- css:改变滚动条样式
以下亲测谷歌内核的浏览器有用,微软和火狐无效 body::-webkit-scrollbar {/*滚动条整体样式*/ width: 5px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1 ...
- js方法call和apply实例解析
在js编程中实现继承时 用到了两个很特殊的方法,call和apply. 在ECMAScript v3中,给Function原型定义了这两个方法,这两个方法的作用都是一样的:使用这两个方法可以像调用其他 ...
- jQuery中添加/改变/移除改变CSS样式例子
在jquery中对于div样式操作我们会使用到CSS() removeClass() addClass()方法来操作了,下面我们就整理了几个例子大家一起来看看吧. CSS()方法改变CSS样式 ...
- JQuery:JQuery 中的CSS()方法
JQuery:CSS()方法jQuery css()方法:css()方法设置或返回被选元素的一个或多个样式属性.1.返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法:css(&quo ...
- jQuery css()方法及方法
知识点一:jQuery css()方法 1.css()方法是什么? css()方法设置或返回被选元素的一个或多个样式属性. 2.返回CSS属性 1.$("p").css(" ...
随机推荐
- eclipse与SVN 结合(删除SVN中已经上传的问题)
问题是: 我有一个文件已经上传到了SVN ,但是我想把这个在SVN上的目录删除掉? 解决方法如下: 1,第一步,先在本地删除所有的你需要删除的文件: 2,第二步,选择当前的项目右键“Team”—“Up ...
- 要想找出包含“w”的名字
要想找出包含“w”的名字:mysql> SELECT * FROM pet WHERE name LIKE '%w%'“_”:匹配任何单个字符“%”:匹配任意数目字符(包括零字符)
- POJ1013 称硬币
题目链接:http://poj.org/problem?id=1013 题目大意 有12枚硬币.其中有11枚真币和1枚假币.假币和真币重量不同,但不知道假币比真币轻还是重.现在,用一架天平称了这些币三 ...
- linux rpm 安装后 mysql 默认安装目录等信息
MySQL安装完成后不象SQL Server默认安装在一个目录,它的数据库文件.配置文件和命令文件分别在不同的目录,了解这些目录非常重要,尤其对于Linux的初学者,因为 Linux本身的目录结构就比 ...
- fedora开机出现There is a problem with the configuration server. (/usr/libexec/gconf-sanity-check-2 exited with status 256)
Install problem!The configuration defaults for GNOME Power Manager have not been installed correctly ...
- TCP KeepAlive的几个附加选项
TCP_KEEPALIVE选项只是一个开关,Linux中默认的Keepalive的选项如下: $sudo sysctl -a | grep keepalive net.ipv4.tcp_keepali ...
- CocoaAsyncSocket UDP发送数据超过包大小限制(Message too long)
最近在做iOS上,基于UDP传输音视频时遇到的一个问题,这边纪录一下: 由于考虑实时性比较高,所以采用了 CocoaAsyncSocket 的UDP框架来实现,将视频切割成一帧帧的图片发给服务端,不过 ...
- ThinkPHP学习(三)
我们已经将数据保存到了后台数据库,那接下来我们肯定要将数据显示出来看看了. 先建立一个要显示数据的模板formlist.html: <!DOCTYPE HTML PUBLIC "-// ...
- Spring使用内存数据库二
在上篇<Spring 使用内存数据库>中我们使用Hibernate作为ORM的框架,直接调用Hibernate的API进行相关的持久化操作,但在实际项目中,可能会由于公司规定等原因要求统一 ...
- 说说JSON和JSONP,也许你会豁然开朗,含jQuery使用jsonp用例
[原创]说说JSON和JSONP,也许你会豁然开朗,含jQuery用例 前言: 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了 ...