JQuery入门到实践（三）

JQuery CSS操作

$("p").css("width","100px");  //设置单一css
$("div").css({
"width":"100px",
"height":"100px"
});   //设置多种css
$("div").addClass("style1");  //增加样式文件里的样式
$("div").removeClass("style1");  //移除样式文件里的样式
$("div").toggleClass("style1");  //切换样式文件里的样式

//JQuery盒子模型
$("div").height(); //盒子高度
$("div").innerHeight(); //盒子高度+内边距+外边距
$("div").outerHeight(); //盒子高度+内边距+外边距+边框
$("div").width(); //盒子宽度

//JQuery效果
$("div").hide(毫秒数); //隐藏
$("div").show(毫秒数); //显示
$("div").toggle(毫秒数); //切换显示/隐藏
$("div").fadeIn(毫秒数); //淡入
$("div").fadeOut(毫秒数); //淡出
$("div").fadeToggle(毫秒数); //切换淡入/淡出
$("div").fadeTo(毫秒数,透明度0-1); //淡化
$("div").slideDown(毫秒数); //滑动向下
$("div").slideUp(毫秒数); //滑动向上
$("div").slideToggle(毫秒数); //切换滑动向上/向下

//JQuery回调
$("div").hide(毫秒数,function(){
console.log("动画结束，这个方法称为回调函数。")
});