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(" ...
随机推荐
- Java多线程中的内存模型
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6536131.html 一:现代计算机的高速缓存 在计算机组成原理中讲到,现代计算机为了匹配 计算机存储设备的 ...
- Linux下找不到动态链接库(转)
1.生成静态库 生成静态库使用ar工具,其实ar是archive的意思 $ar cqs libhello.a hello.o 2.生成动态库 用gcc来完成,由于可能存在多个版本,因此通常指定版本号: ...
- CentOS 7 安装php5.6,Nginx,Memcached环境及配置
安装php5.6版本以后不再需要安装Zend Guard,而是用yum命令安装php-opcache及php-pecl-apcu就可以有效的提高php执行速度. 1. 配置yum源 事先确认yum源的 ...
- cpu高 load 高 内存高 io 高怎么排查
一个应用占用CPU很高,除了确实是计算密集型应用之外,通常原因都是出现了死循环. (友情提示:本博文章欢迎转载,但请注明出处:hankchen,http://www.blogjava.net/hank ...
- 【DB2】数据迁移
数据迁移概述 在日常生活中常有数据的导入导出,为此db2提出了很多工具可以选择,export.import.load.db2look.db2move.db2dart,如下图所示: a.最上面虚线框部分 ...
- redis数据淘汰策略
概述 在 redis 中,允许用户设置最大使用内存大小 server.maxmemory,在内存限定的情况下是很有用的.譬如,在一台 8G 机子上部署了 4 个 redis 服务点,每一个服务点分配 ...
- loadrunner error 27796 Failed to connect to server
(2012-10-23 01:23:17) 转载▼ Action.c(58): Error -27796: Failed to connect to server "www.baidu. ...
- Spring Boot 使用Jar打包发布, 并使用 Embedded Jetty/Tomcat 容器
Jar包发布 在项目pom.xml中, 如果继承了Spring Boot的starter parent, 那么默认已经包含打包需要的plugins了, 设置为jar就能直接打包成包含依赖的可执行的ja ...
- d3dx9库函数
这几天参考了csdn上大坡先生()整理的d3dx9的库函数,我做了一些机械的事情.就算过年练打字了.以下为我整理的d3dx9库函数简略版,以后除了msdn外,存档备用: D3DXCOLOR* D3DX ...
- Linux端口命令
一.开启端口 1.命令行方式 1.开放端口命令: /sbin/iptables -I INPUT -p tcp --dport 8080 -j ACCEPT 2.保存:/etc/rc.d/init.d ...