鼠标点击种植爱心动画效果代码
代码语言:html
所属分类:动画
代码描述:鼠标点击种植爱心动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style> html{height:100%;overflow:hidden;} body{margin:0;height:100%; background:#7a4b94; cursor:pointer;} h1 { margin:0; height:50px; background:#333; line-height:50px; position:relative; z-index:999; filter:alpha(opacity:80); opacity:0.8;} h1 strong { color:#fff; font-family:arial; font-size:18px; position:absolute; top:0px; left:4%; } a { position:absolute; top:0px; right:20px; color:#fff; margin-right:50px; text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:normal; } a:hover { text-decoration:underline; } h2{ margin:0; width:96%; padding:10px 0 14px 4%; background:#333; position:absolute; bottom:0; left:0; z-index:999; filter:alpha(opacity:80); opacity:0.8; color:#fff; font-size:12px; line-height:20px; font-family:Arial, Helvetica, sans-serif; font-weight:normal; } h2 strong { font-size:14px; } </style> </head> <body> <h1> 点击鼠标试试 </h1> <script > function toBrowser() { var browser=navigator.appName; var b_version=navigator.appVersion; if(browser=="Netscape") { return true; } var version=b_version.split(";"); var trim_Version=version[1].replace(/[ ]/g,""); if(browser=="Microsoft Internet Explorer" &&( trim_Version=="MSIE7.0" || trim_Version=="MSIE6.0" || trim_Version=="MSIE8.0")) { return false; } else { return true; } } function starMove(obj,target,iType,fnEnd,iDate) { if(obj.timer) { clearInterval(obj.timer); } if(iType==1) { var sAttr=""; obj.iSpeed={}; for( sAttr in target) { obj.iSpeed[sAttr]=0; } } if(target["transform"]) { if(obj["transform"]) { target["transform"]+=obj["transform"]; } else { css(obj,sAttr,0); } } switch(iType) { case 0: obj.timer=setInterval(function(){doMoveBuffer(obj,target,fnEnd);},24); break; case 1: obj.timer=setInterval(function(){domoveFlexible(obj,target,fnEnd);},24); break; } } function doMoveBuffer(obj,target,fnEnd) { var sAttr=""; var iEnd=1; for(sAttr in target) { if(toBrowser()==false && target["transform"]) { continue; } var iNow=parseFloat(css(obj,sAttr)); if(iNow==target[sAttr]) { continue; } else { var iSpeed=(target[sAttr]-iNow)/5; iSpeed*=0.75; if(iSpeed>0) { iSpeed=Math.ceil(iSpeed); } else { iSpeed=Math.floor(iSpeed); } css(obj,sAttr,iNow+=iSpeed); iEnd=0; } } if(iEnd) { clearInterval(obj.timer); if(fnEnd) { fnEnd.call(obj); } } } function domoveFlexible(obj,target,fnEnd) { var sAttr=""; var iEnd=1; for( sAttr in target) { if(toBrowser()==false && target["transform"]) { continue; } var iNow=parseFloat(css(obj,sAttr)); obj.iSpeed[sAttr]+=(target[sAttr]-iNow)/5; obj.iSpeed[sAttr]*=0.83; if(Math.round(iNow)==target[sAttr] && Math.abs(obj.iSpeed[sAttr])<1) { continue; } else { iNow=Math.round(iNow+obj.iSpeed[sAttr]); css(obj,sAttr,iNow); iEnd=0; } } if(iEnd) { clearInterval(obj.timer); if(fnEnd) { fnEnd.call(obj); } } } function css(obj, attr, value) { if(arguments.length==2) { if(attr=="transform") { return obj.transform; } var i=parseFloat(obj.currentStyle?obj.currentStyle[attr]:document.defaultView.getComputedStyle(obj, false)[attr]); var val=i?i:0; if(attr=="opacity") { val*=100; } return val; } else if(arguments.length==3) { switch(attr) { case 'width': case 'height': case 'paddingLeft': case 'paddingTop': case 'paddingRight': case 'paddingBottom': value=Math.max(value,0); case 'left': case 'top': case 'marginLeft': case 'marginTop': case 'marginRight': case 'marginBottom': obj.style[attr]=value+'px'; bre.........完整代码请登录后点击上方下载按钮下载查看
网友评论0