JavaScript 高仿真可控弹簧振子实现代码- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript 高仿真可控弹簧振子实现代码

Javascript: 自己开发Dojo的建议框架; js每次Title显示不同的名言; 不用AJAX和IFRAME,说说真正意义上的ASP+JS无刷新技术; 无限级别的菜单（侧拉菜单）; 点选TOP后并不是直接跳到页顶的，而是滚动上去; js下拉菜单中自动信息轮换播放; 英文首字母全大写的js实现脚本; 实例区别onClick和onDBClick两事件方法; 改变文本框字体颜色的js脚本; js星空效果代码; 判断li是否有样式的js代码; 文本框点击时文字消失，失去焦点时文字出现; 如何让一个层关闭之后，就算刷新页面了也不显示。除非关闭页面再次打开; 右下角弹出窗口效果代码; JS控制对象移动效果; 验证用户是否修改过页面的数据的实现方法; Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]; 正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度; EXT富客户端后台管理系统初步代码; 不同浏览器javascript变量作用域的处理方法

No. « ‹ 110 111 112 113 › »

技术文章搜索

关键字

Javascript 中的 JavaScript 高仿真可控弹簧振子实现代码

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 391 ::

收藏到网摘: n/a

JS window.opener返回父页面的应用利用JQuery+EasyDrag 实现弹出可拖动的Div，同时向Div传值，然后返回Div选中的值

我刚学JavaScript ，看见一些牛人写了许多特效，我也花了一天写了一个弹簧振子，完全独创，没有借鉴任何人的代码.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>高仿真弹簧振子(压缩使用版)</title>
<script type="text/javascript">
/////////////////////////////您可根据，教学班里的说明自己删除,修改各种元素供自己使用（要不然把教版改了也行，这里的变量名都是教学版中变量名每个单词的第一个字母缩写，这里没有加改变平滑度的参数，已经是最平滑的了）。/////////////////////////////////////////////// 2009/10/20 吕良汉
var HI=false; function IO() { SL=parseFloat(document.getElementById("SL").value)+2; if(SL <=1) { alert("速度损失>-1"); return; } T =parseFloat(document.getElementById("T").value); if(T <0) { alert("大哥！，我现在还不能让时光倒流"); return; } if(HI==false) { HI=true; o= document.getElementById("divM"); SI =parseFloat(document.getElementById("SI").value); M(); }} function Distance() { o= document.getElementById("divM"); o.style.left=parseFloat(document.getElementById("P").value)+"px"; } function Back() { if(HR) { TS=false; HR=false; TOTM=0; IM=0;
o.style.left=parseFloat(document.getElementById("P").value)+"px"; SI=30; SL=3; HI=false; } } var TS = false; function S() { TS=true; }
//////////////////////////////////////////////////////////////////////////////////this is Spring Begin//////////////////////////////////////////////////////////////////////// var o=0; var T =0 var SI=30; var HR=false; var SC=1; var IM=true; var TOTM=0; var D="r"; var SIADAR =1; var SIADAL =1; var SL=3; function M() { if(TS){ HR=true; return; } if(HR){ return; } if(SC>0){ D="r"; if(TOTM%2==0){ IM=true;} } else if(SC<0) { D="l"; if(TOTM%2==1){ IM=true;} } if(o.offsetLeft<0&&TOTM==0){ o.style.left=o.offsetLeft+SI+"px"; } if(TOTM==0){ SC=SI; } if(TOTM!=0){ o.style.left=o.offsetLeft+SC+"px"; } if(o.offsetLeft>=0&&TOTM%2==0&&IM){ TOTM++; SC=SC-SL; IM=false; if(SC<=0){ HR=true; return;} } else if(o.offsetLeft>=0&&D=="r"){ SC=SC-SIADAR; } else if(o.offsetLeft>=0&&D=="l") { SC=SC-SIADAL; } else if(o.offsetLeft<=0&&TOTM%2==1&&IM) { TOTM++; SC=SC+SL; IM=false; if(SC>=0){ HR=true; return; } } else if(o.offsetLeft<=0&&D=="l"){ SC=SC+SIADAR; } else if(o.offsetLeft<=0&&D=="r"&&TOTM!=0) { SC=SC+SIADAL; } setTimeout( "M()",T); } ///////////////////////////////////////////////////////////////Here spring is end////////////////////////////////////////////////////////////////////////////////////////// </script>
</head>
<body>
<div id="divMiddle" style=" position:absolute;top:200px;left:50%;width:1px;height:500px; background-color:#000">
<div id="divM" style="position:absolute; top:0px; left:-1px; width:273px; height:28px; background-color:#009; color:#FF0;" onClick="IO()">设置完以后从新激活元素然后点我！！</div>
</div>
<input type="button" value="重新激活元素" id="back" style="width:100px;height:25px;top:220px;left:500px;" onclick="Back()"/>运行以后请从新激活
<br>
初始的速度(单位：像素/毫秒):　　　
<input type="text" id="SI"value="30" />
<br>
移动时间间隔(单位：毫秒): 　　　　
<input type="text" id="T" value="1" />
<br>
半个周期损失的(速度)能量（>-1）：　
<input type="text" id="SL" value="1" />
<br>
开始位置到中轴的距离(单位：像素)：<input type="text" id="P" value="-1" onBlur="Distance()"/>
<br>
<input type="button" id="stop" value="立即停止" style="width:100px;height:25px;top:220px;left:500px;" onclick="Stop()" />
</body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

这里运行的是我的压缩版代码(在网上运行有些卡)，我会马上把，完整版和带注释的代码上传(写得很详细，第一次在博客里发代码，还挺难控制！哈哈!),还有高手们不要见笑，我用的是很笨的方法，过些日子会有新特效上传，（这个弹簧是我做的网页里的一个按钮特效，我那个网页里有很多特效，网页还没做完，等做完我就把所有原创特效都发上来）。因为我还在学习，发表新特效的时间可能很慢，请大家谅解!(大家多多想一些特效样式，给我点灵感,哈哈!)
编程思路:
主要用的是物理的思维,想象弹簧运动的过程，然后用If else 和 else if 模拟出来，因为任何事物的行为都是如果..那么..所以用If else 就可以搞定！
出处：http://www.cnblogs.com/NONE/
打包下载

JS window.opener返回父页面的应用利用JQuery+EasyDrag 实现弹出可拖动的Div，同时向Div传值，然后返回Div选中的值

Javascript 中的 JavaScript 高仿真可控弹簧振子实现代码

评论 (0) All