jquery的一些小特效

标签：表示   括号   颜色   lock   pad   显示   操作   json   设置   

1.隐藏、显示某元素，hide()、show()方法，有兼容性问题，在任何版本的IE下都不起作用：

$("#one").hide();　　//隐藏id为one的盒子，底层是设置了display为none;

$("#one").show();　　//显示id为one的盒子，底层是设置了display为block;

还可以往方法中传递一个时间参数，以毫秒为单位，表示多少时间内隐藏、显示：

$("#one").hide(3000);　　//3s内隐藏id为one的盒子，效果是在这3s内指定的盒子慢慢缩小，直至不见

$("#one").show(3000);　　//3s内显示id为one的盒子，效果是在这3s内指定的盒子慢慢变大，直至样式指定的大小

2.淡入淡出，让某盒子慢慢退掉颜色、显示颜色，fadeOut()、fadeIn()方法，有兼容性问题，在任何版本的IE下都不起作用：

$("#one").fadeOut();　　//让id为one的盒子的背景色慢慢褪去，最后盒子消失，display为none

$("#one").fadeIn();　　//让id为one的盒子的背景色慢慢恢复

同理，如果往fadeOut()、fadeIn()方法中传入一个时间参数，则表示在多少时间之内完成以上操作。

3.滑动解锁，slideUp()、slideDown()方法，有兼容性问题，在任何版本的IE下都不起作用：

$("#one").slideUp();　　//盒子上滑收缩隐藏

$("#one").slideDown();　　//盒子下滑恢复显示

同理，如果往slideUp()、slideDown()方法中传入一个时间参数，则表示在多少时间之内完成以上操作。

4.执行动画，animate()方法，用法：animate({" ":" "})，大括号里面数据是json格式，键值都要用双引号括住。方法同样有兼容性问题，在任何版本的IE都下不起作用

$("#one").animate({"margin-left":"300px"});　　//让盒子往右300px

$("#one").animate({"margin-left":"300px"},3000);　　//3s内让盒子往右300px

$("#one").animate({"padding":"30px"});　　//让盒子变大60px

jquery的一些小特效

标签：表示   括号   颜色   lock   pad   显示   操作   json   设置   

原文地址：http://www.cnblogs.com/koushr/p/5873389.html