学习JQ日志03

 

toggle,toggleClass,slidToggle,fadeToggle.

toggle(fn,fn...)此方法是用于绑定两个或多个时间处理器函数，以影响被选元素的

轮流的click事件。
例如，如果存在三个函数，则第一次点击将调用第一个函数，第二次点击调用第二个

函数，第三次点击调用第三个函数。第四次点击再次调用第一个函数，以此类推。
$(selector).toggle(speed,callback)
speed:可选规定hide、show效果的速度。默认是“0”
毫秒  1500
slow
normal
fast
callback：当toggle()方法完成是执行的函数。
切换 Hide() 和 Show()：如果元素已隐藏，则运行 show()。如果元素可见，则元素

hide()。这样就可以创造切换效果。

显示或隐藏元素
规定是否只显示或只隐藏所有匹配的元素。

$(selector).toggle(switch)
switch true---显示元素   false---隐藏元素

ToogleClass
是切换类的，可以指定多个css样式，参数之间是空格。
jQuerytoggleClass(classCSS类名 )如果存在（不存在）就删除（添加）一个类。
[示例]:$(this).toggleClass("selected")

$(document).ready(function(){
 $(".stripe tr").click(function(){
 $(this).toggleClass("click")})
 });

还有slideToggle
因为toggle其实是一个隐藏/显示，是针对top坐标说的，所以其方向是从左上角开始

隐藏，显示。而sildetoggle是通过高度变化滑动隐藏自身的。它的范围是自己的高度
$(document).ready(function(){
var s=$("#col").click(function(){s.fadeTo('slow',0.5).slideToggle

(1100,function(){s.slideDown(1000,function(){s.fadeTo('slow',1)})
})
})
});
这里的效果是单击后，淡入为0.5(即透明)然后再slidedown的时候，又把透明度改为1

表示不透明。

还有就是fadedToggle
fadedToggle([duration],[easing],[callback])
可以以一种渐隐渐现的效果，再一次单击后隐藏/显示元素。
那么透明的效果主要是看function函数中的设置可能为一个阶梯装的透明度描述
这是通过改变透明实现的，透明都为零是为隐藏。
$(document).ready(function(){
var s=$(#col).click(function(){s,fadeToggle(1100,function(){s,fadeToggle

(1000)})});
})
所以这样的效果可以用于一个按钮，增加美感。