爱站程序员基地
代码
<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><title></title><style type=\"text/css\">* {padding: 0;margin: 0;}.outer {width: 200px;position: fixed;bottom: 0;right: 0;display: none;}span {position: absolute;border: 1px solid black;cursor: pointer;}.topPart {width: 200px;height: 120px;background-color: yellow;}.downPart {width: 200px;height: 120px;background-color: yellowgreen;}</style><script type=\"text/javascript\" src=\"jQuery.js\"></script><script type=\"text/javascript\">$(function(){//1.进场动画$(\'.outer\').fadeIn(1500);$(\'span\').click(function(){//2.下半部分高度慢慢变为0$(\'.downPart\').animate({height:0},500,function(){//3.整个盒子宽度为0$(\'.outer\').animate({width:0},500);});});});</script></head><body><div class=\"outer\"><span>关</span><div class=\"topPart\"></div><div class=\"downPart\"></div></div></body></html>
