js 动画效果总结

animate()
通过样式把一个状态改变成另外一个状态
如：$(selector).animate(styles,speed,easing,callback);
styles的参数可以有很多如:backgroundPosition borderWidth borderBottomWidth borderLeftWidth borderRightWidth borderTopWidth borderSpacing margin marginBottom marginLeft marginRight marginTop outlineWidth padding paddingBottom paddingLeft paddingRight paddingTop height width maxHeight maxWidth minHeight minWidth font fontSize bottom left right top letterSpacing wordSpacing lineHeight textIndent

speed可以是毫秒（1000）"slow" "normal" "fast"
easing的值也是可选的如：swing linear

$(selector).animate({top:"50px"});

fadeIn() 淡入效果来隐藏被选中的元素
fadeOut() 淡出效果来隐藏被选中的元素
$(selector).fadeIn/fadeOut(speed ,callback)
speed的值可以为毫秒（1000）
"slow" "normal" "fast"

hide()/show() 隐藏/显示被隐藏的元素

slideUp()通过滑动效果，隐藏被选元素
slideDown()通过滑动效果，显示隐藏的被选元素
$(selector).slideDown(speed,callback)
speed的值可以为毫秒（1000）
"slow" "normal" "fast"

slideToggle()通过滑动效果来显示隐藏元素（如果元素是隐藏的则显示，乳沟显示则隐藏这些元素）

转载于:https://www.cnblogs.com/fangdx/p/3972925.html