jQuery toggle()设置CSS样式

smile丶鹏丨

smile丶鹏丨

2016-02-19 14:37

有一种朋友不在生活里,却在生命力;有一种陪伴不在身边,却在心间。图老师即在大家的生活中又在身边。这么贴心的服务你感受到了吗?话不多说下面就和大家分享jQuery toggle()设置CSS样式吧。
toggle()
切换元素的可见状态。
如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。
---------------------------------
示例
切换所有段落的可见状态。
HTML 代码:
pHello/pp style="display: none"Hello Again/p
jQuery 代码:
$("p").toggle()
结果:
p tyle="display: none"Hello/pp style="display: block"Hello Again/p
设置背景图片,以突出透明度的效果
代码如下:
head
titletoggle()/title
style type="text/css"
!--
body{
background:url(bg.jpg);
margin:20px; padding:0px;
}
img{
border:1px solid #FFFFFF;
}
--
/style
script language="javascript" src="jquery.min.js"/script
script language="javascript"
$(function(){
$("img").toggle(
function(oEvent){
$(oEvent.target).css("opacity","0.5");
},
function(oEvent){
$(oEvent.target).css("opacity","1.0");
}
);
});
/script
/head
body
img src="test.jpg"
/body
展开更多 50%)
分享

猜你喜欢

jQuery toggle()设置CSS样式

Web开发
jQuery toggle()设置CSS样式

JQuery toggle使用分析

Web开发
JQuery toggle使用分析

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

jQuery 改变CSS样式基础代码

Web开发
jQuery 改变CSS样式基础代码

JQuery CSS样式控制 学习笔记

Web开发
JQuery CSS样式控制 学习笔记

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

网页制作:使用css设置iframe样式

Web开发
网页制作:使用css设置iframe样式

CSS教程:CSS样式层叠顺序

Web开发
CSS教程:CSS样式层叠顺序

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

jQuery get和post 方法传值注意事项

jQuery get和post 方法传值注意事项

如何辨别Linux中的open和fopen函数

如何辨别Linux中的open和fopen函数
下拉加载更多内容 ↓