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

高仿真弹簧振子(压缩使用版)

/////////////////////////////您可根据,教学班里的说明自己删除,修改各种元素供自己使用(要不然把教版改了也行,这里的变量名都是教学版中变量名每个单词的第一个字母缩写,这里没有加改变平滑度的参数,已经是最平滑的了)。/////////////////////////////////////////////// 2009/10/20 吕良汉
var HI=false;
function IO()
{
SL=parseFloat(document.getElementById("SL").value)+2;
if(SL -1");
return;
}
T =parseFloat(document.getElementById("T").value);
if(T 0){
D="r";
if(TOTM%2==0){
IM=true;}
}
else if(SC=0&&TOTM%2==0&&IM){
TOTM++;
SC=SC-SL;
IM=false;
if(SC=0&&D=="r"){
SC=SC-SIADAR;
}
else if(o.offsetLeft>=0&&D=="l") {
SC=SC-SIADAL;
}
else if(o.offsetLeft=0){
HR=true;
return;
}
}
else if(o.offsetLeft

设置完以后从新激活元素然后点我!!

运行以后请从新激活

初始的速度(单位:像素/毫秒):   

移动时间间隔(单位:毫秒):     

半个周期损失的(速度)能量(>-1): 

开始位置到中轴的距离(单位:像素):

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

这里运行的是我的压缩版代码(在网上运行有些卡),我会马上把,完整版和带注释的代码上传(写得很详细,第一次在博客里发代码,还挺难控制!哈哈!),还有高手们不要见笑,我用的是很笨的方法,过些日子会有新特效上传,(这个弹簧是我做的网页里的一个按钮特效,我那个网页里有很多特效,网页还没做完,等做完我就把所有原创特效都发上来)。因为我还在学习,发表新特效的时间可能很慢,请大家谅解!(大家多多想一些特效样式,给我点灵感,哈哈!)

编程思路:
主要用的是物理的思维,想象弹簧运动的过程,然后用If else 和 else if 模拟出来,因为任何事物的行为都是如果..那么..所以用If else 就可以搞定!
出处:http://www.cnblogs.com/NONE/

打包下载

(0)

相关推荐

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

    高仿真弹簧振子(压缩使用版) /////////////////////////////您可根据,教学班里的说明自己删除,修改各种元素供自己使用(要不然把教版改了也行,这里的变量名都是教学版中变量名每个单词的第一个字母缩写,这里没有加改变平滑度的参数,已经是最平滑的了)./////////////////////////////////////////////// 2009/10/20 吕良汉 var HI=false; function IO() { SL=parseFloat(documen

  • javascript高仿热血传奇游戏实现代码

    前言 游戏的第一个版本开发于14年,浏览器端使用html+css+js,服务端使用asp+php,通讯采用ajax,数据存储使用access+mySql.不过由于一些问题(当时还不会用node,用asp写复杂的逻辑真的会写吐:当时对canvas写的也少,dom渲染很容易达到性能瓶颈),已经废弃.后来用canvas重制了一版.本文写于18年. 1.开发前的准备 为什么要用Javascript来实现一款比较复杂的PC端游戏 1.js实现PC端网游是可行的.随着PC.手机硬件配置的升级和浏览器的更新换

  • 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=&qu

  • 详解JavaScript 高阶函数

    高阶函数简介 高阶函数 的英文名叫 Higher-Order Function ,是 函数式编程 中的一种.他的表现形式往往是通过把函数作为参数传入另一个函数,或者将函数作为另一个函数的返回值返回.在实际开发业务中, 高阶函数往往可以抽象我们的代码 ,将我们的命令式编程转换为复用性更高级的函数式编程,从而 提升我们的代码质量 . 下面拿3个面试中常问的高阶函数举例子,希望看完以后能够提升大家对JS的理解,提高我们的代码质量. chat is cheap,show you my code~ Arr

  • 原生JavaScript实现弹幕组件的示例代码

    前言 如今几乎所有的视频网站都有弹幕功能,那么今天我们就自己用原生 JavaScript 封装一个弹幕类.这个类希望有如下属性和实例方法: 属性 el容器节点的选择器,容器节点应为绝对定位,设置好宽高 height 每条弹幕的高度 mode 弹幕模式,half则为一半容器高度,top为三分之一,full为占满 speed弹幕划过屏幕的时间 gapWidth后一条弹幕与前一条弹幕的距离 方法 pushData 添加弹幕元数据 addData持续加入弹幕 start开始调度弹幕 stop停止弹幕 r

  • 11个Javascript小技巧帮你提升代码质量(小结)

    本文会不断更新,不足之处欢迎评论区补充. 1. 提炼函数 好处: 避免出现超大函数. 独立出来的函数有助于代码复用. 独立出来的函数更容易被覆写. 独立出来的函数如果拥有一个良好的命名,它本身就起到了注释的作用. 语义化将多段分离的逻辑放在不同的函数中实现,可以使代码逻辑清晰,清楚的看到每一步在做什么. 代码举例: 实现获取数据,然后操作dom显示数据,最后添加事件 函数提炼前 // 逻辑都写在一起,需要将所有逻辑看完才知道这段代码是干嘛的,局部逻辑无法复用 function main() {

  • JavaScript实现跟随广告的示例代码

    浮动广告是目前网站很常见的一种广告形式,浮动广告能实时跟随用户的浏览,有效的传达产品要表达的意思,达到很好的传播效果.那么浮动广告是怎么实现的呢,其实实现浮动广告并不难,具体如下: * { margin: 0; padding: 0; } img { position: absolute; left: 0; } p { text-align: center; line-height: 40px; } <img src="images/left_ad.png" alt="

  • JavaScript异步上传图片文件的实例代码

    html: <form action="url" enctype="multipart/form-data" id="myform" method="post"> <input accept="image/*" id="addfile" type="file" /> </form> jquery: $("#addfile&

  • JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)

    最近做了个项目,其中有项目需求是要实现跑马灯抽奖效果,实现此功能主要用到js相关知识,废话不多说,感兴趣的朋友可以阅读下全文. 开始之前先来看上篇文章遗漏的两个问题和几个知识点,是自己重构的过程中需要用到的: 1.移动端1px像素线的问题 对于设计师给我的手机端网页的设计稿都是2倍图.按照道理来说,在写网页的时候,所有对象的实际尺寸都是会除2.但是对于1像素的线呢? 先来看两张图,设计稿的效果: 在三星 S4下的实际显示效果: 可以看到这个时候1px的线竟然显示不出来了.这个问题是跟 S4手机的

  • JavaScript中removeChild 方法开发示例代码

    1. 概述 删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到别的位置. 当你遍历一个父节点的子节点并进行删除操作时,要注意,children属性是一个只读属性,并且它在子节点变化时会实时更新 // 拿到待删除节点: var self = document.getElementById('to-be-removed'); // 拿到父节点: var parent = self.parentElement; // 删除: var removed = parent.remove

随机推荐