编程 Javascript

jQuery toggle()设置CSS样式

Posted in Javascript onNovember 05, 2009

toggle()
切换元素的可见状态。
如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
示例
切换所有段落的可见状态。
HTML 代码:
HelloHello Again
jQuery 代码:
$("p").toggle()
结果:
HelloHello Again
设置背景图片，以突出透明度的效果

<head> 
<title>toggle()</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>

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js下弹出窗口的变通

Apr 18 Javascript

JavaScript 动态将数字金额转化为中文大写金额

May 14 Javascript

Ajax局部更新导致JS事件重复触发问题的解决方法

Oct 14 Javascript

jquery制作LED 时钟特效

Feb 01 Javascript

JavaScript中的lastIndexOf()方法使用详解

Jun 06 Javascript

优化RequireJS项目的相关技巧总结

Jul 01 Javascript

jQuery垂直多级导航菜单代码分享

Aug 18 Javascript

字太多用...代替的方法（两种）

Mar 15 Javascript

ECMAScript6 新特性范例大全

Mar 24 Javascript

微信小程序分页加载的实例代码

Jul 11 Javascript

Vue计算属性的使用

Aug 04 Javascript

mpvue写一个CPASS小程序的示例

Sep 04 Javascript

javascript 打印内容方法小结

Nov 04 #Javascript

兼容多浏览器的iframe自适应高度(ie8 、谷歌浏览器4.0和 firefox3.5.3)

Nov 04 #Javascript

JavaScript 自动分号插入（JavaScript synat:auto semicolon insertion）

Nov 04 #Javascript

jQuery 加上最后自己的验证

Nov 04 #Javascript

javascript Math.random()随机数函数

Nov 04 #Javascript

jquery animate 动画效果使用说明

Nov 04 #Javascript

JavaScript window.setTimeout() 的详细用法

Nov 04 #Javascript