摘要:
在页面很长(超过3屏)且图片又很多时,默认情况下浏览器会加载所有图片,有可能导致第二屏的图片显示出来了,但第一屏的图片还在加载,这种情况最适合用"javascript延时加载"来改善用户体验.原理:1.根据图片元素距页面顶部的距离,判断图片自身在第几屏2.所有图片元素的src值先不设置,改而用其它自定义属性,比如src写成lazy_src(这样浏览器就不会主动加载图片)3.根据1的判断,如果轮到自...
阅读全文
posted @ 2010-05-13 20:33
菩提树下的杨过
阅读(5611)
推荐(2)
摘要:
虽然从司徒先生的博客上看到 全世界最短的IE判定很长时间了,却一直对于原理没怎么去细看,今天同事(也是一后台程序员,并非前端)又问到这个问题,于是我这个前端外行认真研究了下,基本弄懂了,贴在这里备份,高手就绕过吧,以免浪费时间注:随着时间的推移,IE9及以上版本已经修复了该BUG(除非设置成兼容模式...
阅读全文
posted @ 2010-05-13 16:49
菩提树下的杨过
阅读(6422)
推荐(1)
摘要:
之前我们所做的动画都是基于x,y二维坐标轴的,在三维动画中我们还需要增加一个垂直于屏幕“向里”或“向外”的Z轴,那么z轴到底是应该向外,还是向里呢?这个其实无所谓,不过为了统一,习惯上通常把z轴约定为向里,即所谓的“右手坐标系”右手坐标系的得名:伸出右手,让食指、中指、大拇指相互垂直;然后 食指指向x轴正向,中指指向y轴正向,...
阅读全文
posted @ 2010-05-08 21:26
菩提树下的杨过
阅读(4045)
推荐(1)
摘要:
AspNetPager一直是我最喜欢用的分页控件(而且作者最近还推出了专门针对MVC的版本http://mvcpager.codeplex.com/),默认情况下运行后的样子类似下图我个人觉得其实也挺好看,但昨天遇到一客户的网站背景是黑色的,觉得红色的当前页码不好看,要求换成对比度比较高的“绿色”,一时之间也懒得去一一尝试AspNetPager的各种属性了,观察一下页面最终...
阅读全文
posted @ 2010-05-07 09:42
菩提树下的杨过
阅读(1530)
推荐(0)
摘要:
先要复习一下三角函数与余弦定理:对于直角三角形,三边长a,b,c与三个角A,B,C的关系如下:正弦函数:余弦函数:正切函数:反正切函数:(好象现在的教科书里改叫“余切”函数) 或 勾股定律:但对于不是直角的三角形,就必须用余弦定律来处理了:利用余弦定理也可以处理反向运动学中的伸展:上面这个是示意图(花了我近一天时间才弄明白,汗,高中的数学知识全还给老师了)说明:蓝色的se...
阅读全文
posted @ 2010-05-06 13:34
菩提树下的杨过
阅读(1347)
推荐(0)
摘要:
先回顾上篇所说的"正向运动学":以人行走的例子来说,基本上可以理解为大腿驱动小腿,小腿驱动脚,从而引发的一系列姿态调整和运动。再举一个例子,我们用着拿一根软鞭或链条的一端挥舞,被手挥舞的这一端会把"能量"向另一端传递(即固定端驱动紧接的部分,而紧接的部分又驱动下一段紧接的部分),从而使整个系统也随之运动.而"反向运动学"正好相反,举个不恰当的例子,小时候估计很多人玩过“死”...
阅读全文
posted @ 2010-05-05 11:40
菩提树下的杨过
阅读(2209)
推荐(0)
摘要:
所谓"正向运动学"通俗点讲就是把几个连接部件的一端固定起来,另一个端可以自由(向前/向外)运动。比如人的行走,单个下肢可以理解为脚连接小腿,小腿连接大腿,大腿连接腰。行走的过程,相当于二条腿相对固定于腰部,大腿运动驱动小腿,小腿又驱动脚,从而带动整个连接系统的一系列运动。先来一个基本的关节类Segment:(就是一个圆角矩形+二个小圆圈)为了动态控制关节的旋转,再来一个简单的滑块控件类:(下列代码...
阅读全文
posted @ 2010-04-30 15:25
菩提树下的杨过
阅读(2081)
推荐(1)
摘要:
NND,明天就是世博,上海政府都发公文倡议企业五一休息5天,我们公司居然只放3天,真无语,搞得大家今天都没心情工作。下雨天打孩子,闲着也是闲着,把以前看到同事做的一个小Loading模拟了一下:源文件:http://cid-2959920b8267aaca.skydrive.live.com/self.aspx/Flash/LoadingMC.rar
阅读全文
posted @ 2010-04-30 13:13
菩提树下的杨过
阅读(1676)
推荐(0)
摘要:
万有引用公式:其中G为万有引力常数代码虽然很长,但是其中有很多都是上一篇里封装好的方法直接复制过来的,应该不难理解再来模拟一下地球绕着太阳转:代码就是在第一段的基础上修改的,可以看到在"远日点"速度较慢(因为距离越远,万有引力越小,对应的加速度也较小),在"近日点"速度较快(距离越近,万有引力越大,对应的加速度也较大)节点花园NodeGarden:为啥叫这个名字,我也说不上来,反正ActionSc...
阅读全文
posted @ 2010-04-28 15:14
菩提树下的杨过
阅读(2085)
推荐(0)
摘要:
动能公式:动量公式:动量守恒:能量守恒: 根据这些规律可以得到下列方程组:解该方程组,得到下面的公式:把这二个公式相减,可以得到:即:我们也经常利用这个公式简化运算基本的动量守恒演示:先给ball类添加一个质量"属性"一维单轴刚体碰撞测试:二维坐标上的刚体碰撞:先来看这张图,红球a以Va速度运动,蓝球b以Vb速度运动,二球的连线正好与x轴平行(即:水平对心碰撞),碰撞的过程可以理解为二球水平速度分...
阅读全文
posted @ 2010-04-22 11:25
菩提树下的杨过
阅读(6583)
推荐(1)
摘要:
坐标旋转是个啥概念呢?如上图,(蓝色)小球 绕某一中心点旋转a角度后,到达(红色)小球的位置,则红色小球相对中心点的坐标为:x1 = dx * cos(a) - dy * sin(a)y1 =dy * cos(a) + dx * sin(a)这个就是坐标旋转公式,如果要反向旋转,则公式要修正一下,有二种方法:1.将a变成-a,即:x1 = dx * cos(-a) - dy * sin(-a)y1...
阅读全文
posted @ 2010-04-20 20:32
菩提树下的杨过
阅读(6794)
推荐(1)
摘要:
碰撞检测基本上可能分为二类:对象与对象的碰撞检测、对象与点的碰撞检测为了方便测试,先写一个box类(生成一个小矩形)最基本的对象碰撞检测:hitTestObject如果把Box换成前面例子中的Ball,就是下面这个样子:很明显:矩形换成球后,碰撞检测变得不精确了,有一些球似乎并没有真正撞到其它球也停下来了,这是为什么腻?答案就在于:Flash对象碰撞检测默认采用“对象的矩形边界&rdq...
阅读全文
posted @ 2010-04-19 11:24
菩提树下的杨过
阅读(5000)
推荐(1)
摘要:
上一篇里演示的弹性运动加上摩擦力因素后,物体最终基本上都会比较准确的停在目标位置。但是我们回想一下现实世界中的弹簧,如果把弹簧的一头固定起来(即相当于目标点),而另一端栓一个球,把球拉开或压缩一定距离然后松手,事实上小球永远也不可能到达弹簧固定的那一端(因为弹簧即使压缩到最紧,也总有一定的长度)所以如果要在Flash里模拟现实中的弹簧,真正的目标点绝不是弹簧的端点,而是目标点再偏移一段距离(即弹簧...
阅读全文
posted @ 2010-04-18 13:15
菩提树下的杨过
阅读(1703)
推荐(0)
摘要:
动画中的弹性运动 从视觉效果上接近 物理经典力学中的单摆运动或弹簧(胡克定律F=Kx)振动先看下面的模拟演示:规律:小球先从出发点(初始为最左侧)向目标点(中心点)加速狂奔,奔的过程中速度越来越大,但加速度越来越小,等经过目标点时,发现速度太大刹不住车(此时速度达到最大值,但加速度减为0),奔过头了!于是加速度发生逆转,从0开始变为负值,从而导致速度越来越小,等速度减到0时,也奔到了最右侧(此时负...
阅读全文
posted @ 2010-04-17 12:02
菩提树下的杨过
阅读(2111)
推荐(0)
摘要:
缓动 与 匀变速 看上去很类似,但其实有区别:匀变速的公式为 V = V0 + at --速度v与时间t是线性(正比)关系,而且这种运动不需要确定目标点,速度可以按照这种规律一直变下去而缓动指的是物体越接近目标时速度越慢,速度跟距离成反比关系,用公式描述为 V = k S (0<k<1),这种运动需要先确定一个目标点,比如车辆定点停车:先指定一个位置,然后汽车从远处开过来,快到停车点时...
阅读全文
posted @ 2010-04-16 17:07
菩提树下的杨过
阅读(2579)
推荐(1)
摘要:
以前为了赶项目,利用系统组件制作过一款视频播放器(见Flash/Flex学习笔记(6):制作基于xml数据源的flv视频播放器),但是系统组件实在是太大了,最终生成的swf居然有103K,随着AS3的深入学习,昨天又弄了一个只用AS3的播放器,最终只有8.82K,呵呵,这肥减得那是相当厉害。用到了上一篇(Flash/Flex学习笔记(35):自己动手实现一个滑块控件(JimmySilder))里自...
阅读全文
posted @ 2010-04-16 10:29
菩提树下的杨过
阅读(8097)
推荐(3)
摘要:
先看最终的演示:滑块条的应用实在太广泛了:mp3播放器中声量的大小控制,视频播放时的画面亮度调节,阅读新闻时字体大小的实时调整,对象的大小互动控制...分析:1.任何一个滑块条控件的UI部分,基本上可以分为:背景滑块条 + 滑块按钮 二个部分所以我分成了三部分: JimmySilderBar(背景条),JimmySilderButton(拖动钮),JimmySilder(真正的滑动控件,将前二个组...
阅读全文
posted @ 2010-04-15 13:34
菩提树下的杨过
阅读(3296)
推荐(1)
摘要:
如果想在一个自定义类中注册对stage对象的监听事件,然后在另一个文档类中使用该类的实例(或在fla的时间轴上使用该类的实例),你会很郁闷的发现:在构造函数中始终无法引用到this.stage(用trace(this.stge)会一直返回null),既然引用都得不到,当然也就无法注册事件了,正确的做法如下:即必须在ADDED_TO_STAGE事件以后,才能引用到stage对象,当然还有一个提前是该...
阅读全文
posted @ 2010-04-15 13:06
菩提树下的杨过
阅读(2530)
推荐(0)
摘要:
类似C#中自定义事件需要一个自定义的EventArgs子类一样,AS3也需要开发者自定义一个Event类的子类,这里我们假设一种场景:设计一个Person(人物)类,里面有Age(年龄),Name(姓名),我们希望每当Person类的实例Age(年纪)发生变化时,能触发一些自定义事件,从而调用某些特定的处理方法。 1.先设计Event类的子类AgeChangeEvent这里我们定义了二类事件:年龄...
阅读全文
posted @ 2010-04-14 21:14
菩提树下的杨过
阅读(2527)
推荐(0)
摘要:
AS3历经若干年的成长,已经完全进化为一门面向对象的(动态)语言,但很多介绍AS3的书籍上往往只注意了AS3语言本身,而淡化了如何跟Flash IDE协同开发。1.如何在Flash时间轴代码上创建一个外部as文件中定义的MovieClip实例?假设外部有一个MyClip.as文件,内容如下:新建一个fla文件(注意:要与MyClip.as处于同一目录),然后在时间轴的代码中就可以这样使用了:Ctr...
阅读全文
posted @ 2010-04-14 16:32
菩提树下的杨过
阅读(1469)
推荐(0)
摘要:
题外话:个别朋友总是问我同样的问题,做为一名c#/silverlight程序员为啥还要学flash ?回 答:看日本片时,就不能对照看欧美的么? 不体会日本的细腻,又怎能感觉到欧美的粗放;同样都是web相关的技术,不必报门户之见;何况这二者有很多可以相互借鉴的东西。注:这个例子来自[FL车在臣](在blueidea上又名“寂寞火山”)翻译的“Animation ...
阅读全文
posted @ 2010-04-14 12:59
菩提树下的杨过
阅读(2271)
推荐(0)
摘要:
对象拖拽:这其实就是以前所学知识:Flash/Flex学习笔记(13):对象拖动(startDrag/stopDrag)+ Flash/Flex学习笔记(23):运动学原理的综合运用,要提一下的是下面代码中对于EnterFrame的添加与移除操作对象投掷:在上面的代码中,鼠标的拖拽只影响了小球的y坐标(注:指对运动方面的影响),即仅相当于举高了小球。而投掷则意味着:在鼠标松开小球的那一瞬间,小球也...
阅读全文
posted @ 2010-04-13 13:50
菩提树下的杨过
阅读(1701)
推荐(1)
摘要:
自从VS2010 RC出来以后,就顺便把机器重做了,重装的时候特意没安装VS2008,全线过渡到VS2010和.net4.0,但今天有一小WAP项目,才意识到VS2010貌似不支持WAP窗体,按照记忆参考以前VS2008的做法(见:wap开发体会),下载模板后,一时眼花即没找到新建Mobile Web窗体的地方,于是又把VS2008装回来了,等到把VS2008搞定后,怀着一颗不死之心又重新到VS2...
阅读全文
posted @ 2010-04-09 13:25
菩提树下的杨过
阅读(14840)
推荐(2)
摘要:
对于从Sprite类继承来的对象,要实现拖放当然是Flash/Flex学习笔记(13):对象拖动(startDrag/stopDrag)里讲的方法最方便,但是对于不是从Sprite类继承得来的对象,这startDrag/stopDrag是不能用的,这时候只能采用最通常用做法:利用Mouse_Down,Mouse_UP,Mouse_Move事件来处理注意:对象的Mouse_Move事件,只有当鼠标在...
阅读全文
posted @ 2010-04-09 12:35
菩提树下的杨过
阅读(2773)
推荐(0)
摘要:
在开发过程中,经常会遇到要从一个界面跳到另一个界面的情况,比如:软件中的窗口跳转,web开发中的页面跳转...但在Flash的世界里:只有帧,没有窗口与页面,所以控制时间轴/帧之间的跳转,就成为这一需求最常见的解决办法 源文件: http://cid-2959920b8267aaca.skydrive.live.com/self.aspx/Flash/FrameControl.fla
阅读全文
posted @ 2010-04-08 20:40
菩提树下的杨过
阅读(2504)
推荐(0)
摘要:
虽然label组件很好用,但是达人们都好象不太喜欢用组件(用组件后最明显的问题:会使swf文件增大好多),所以我也慢慢开始习惯能不用组件则尽量不用注:txtMsg为舞台上的动态文本,二个按钮是从公共库里拉出来的实例源文件:http://cid-2959920b8267aaca.skydrive.live.com/self.aspx/Flash/txtScroll.rar
阅读全文
posted @ 2010-04-08 17:32
菩提树下的杨过
阅读(1175)
推荐(0)
摘要:
在一些实时视频或视频分享应用中,需要动态显示麦克风的音量大小,或者检测视频是不是正在播放,这里演示一种简单的音量指示器1.先写一个指示器类其实就是一个根据百分比来填充的矩形2.如何获取音量大小以及监测摄像头直播状态音量大小可以通过activityLevel属性获得,但摄像头的画面变化程度却无法直接获取,但每当摄像头画面有活动时ACTIVITY事件将被触发,所以可在该事件中监测最后一次活动的时间与当...
阅读全文
posted @ 2010-04-08 14:30
菩提树下的杨过
阅读(3887)
推荐(0)
摘要:
直接上代码吧,关键地方都加上注释了:
阅读全文
posted @ 2010-04-08 09:40
菩提树下的杨过
阅读(1848)
推荐(0)
摘要:
摩擦力:假如一个物体在某个方向上沿直线运行,摩擦力会使该方向上的速度越来越小,直到停止。上图示意了该过程,物体以moveAngle角度正向运动,最终的速度speed矢量为vx矢量与vy矢量的矢量和,在每个单位时间内的位移即Speed矢量的大小,分解到x,y轴后,即为vx与vy;加入摩擦力后,speed矢量每单位时间将减少Friction值,也就是视觉上的越来越慢。上面这种方法从物理意义上讲最接近现...
阅读全文
posted @ 2010-04-06 13:00
菩提树下的杨过
阅读(1380)
推荐(0)
摘要:
粒子爆炸:仍然要用到以前的小球类,不过稍加改造增加了x,y轴的速度,其它没变原理:在舞台的某一区域放置大量小球实例,然后在某个时刻让其向四面八方运动即可(即改变每个小球在x,y轴上的坐标)问题:效率!让CPU在每帧对于大量对象进行重绘是很耗资源的,所以当小球跑出舞台边界时,得想办法通知CPU:这些小球不需要再处理了(反正也看不见)!否则纯属折腾CPU,下面的代码用一个数组存放所有对象实例的引用,然...
阅读全文
posted @ 2010-04-05 17:54
菩提树下的杨过
阅读(2043)
推荐(0)
摘要:
先写一个公用的小球类Ball:圆周运行与椭圆运动:主要依靠三角函数结合椭圆公式计算对象的x,y坐标 匀加速直线运动:速度公式:v = v0 + at,物理学上的公式虽然是这样,但是到了Flash中思路得稍微换一下,Flash默认为每秒24帧,而EnterFrame事件在每次进入新一帧时触发,所以可粗略的认为每一帧就是一个“单位时间”,匀加速的重要特征就是每单位时间速度增加固...
阅读全文
posted @ 2010-04-03 18:01
菩提树下的杨过
阅读(1848)
推荐(0)
摘要:
Silverlight中称之为“效果(Effect)”的东东,在Flash里叫“滤镜(Filter)",而且Flash里内置的滤镜要比Silverlight丰富很多,几乎所有对象都有一个filters的属性,它是一个数组,可以将一个或多个滤镜同时应用于某一对象,类似的,如果要去除已经应用的滤镜效果,只要将filters数组清空即可
阅读全文
posted @ 2010-04-03 11:50
菩提树下的杨过
阅读(1419)
推荐(0)
摘要:
transform是flash.Display.DisplayObject的属性之一,而colorTransform又是transform的属性,这也就意味着几乎所有对象都可以使用colorTransform属性这是官方的解释:当 ColorTransform 对象应用于显示对象时,将按如下方法为每个颜色通道计算新值:新红色值 = (旧红色值 * redMultiplier) + redOffse...
阅读全文
posted @ 2010-04-03 11:43
菩提树下的杨过
阅读(4588)
推荐(0)
摘要:
贝塞尔曲线的身影几乎在所有绘图软件中都有出现,下面的代码演示了如何用AS3.0画一段简单的贝塞尔曲线(没有使用Document文档类,想测试的朋友,直接把下面的代码复制贴到第一帧即可)一段曲线通常包含三个点:起点(x1,y1),控制点(x3,y3),终点(x2,y2);也许大家也看出来了:该曲线最终并不经过鼠标所在的点(x3,y3),在y轴方向上,曲线最大高度只有鼠标相对高度的一半,如果想真正的经...
阅读全文
posted @ 2010-04-01 20:53
菩提树下的杨过
阅读(6608)
推荐(1)
摘要:
传统的RGB颜色体系中,每一个分量值的范围都是0到255,如果转换为2进制的话最多需要8位(比如:十进制的255变成二进制则为11111111),三个分量加起来,最多需要24位长度的uint来存储.而通常我们在html中喜欢用16进制比如"#FF0000"来表示红色,即R:255,G:0,B:0,如何高效的从一个表示颜色的unit数字中把这RGB分量提取出来?当然:最容易想到的是利用字符串拆分,拆...
阅读全文
posted @ 2010-04-01 16:22
菩提树下的杨过
阅读(2444)
推荐(0)
摘要:
这是日本roxik大师的作品(据说他的水平在日本还只能排到第二)如果只是做出这些随机动作的小球,也许不算什么,但是让人称奇的是它的CPU占用率,居然不到5%另外还有一些3D/物理引擎,也都很NB,完整演示网址见: http://temp.roxik.com/感叹:水平第二都已经这样了,排名第一的岂不是神了?
阅读全文
posted @ 2010-04-01 09:42
菩提树下的杨过
阅读(2032)
推荐(1)
摘要:
Sprite有一个graphics可以用来绘制基本图形,比如我们要画下面这个图形:对应的AS3代码为:把它加到舞台上,并自动跟着鼠标转动(下列代码写在第一帧):这里用到了反正切函数,其原理示意图如下:即以鼠标所在点与Arrow图形中心点为参考,构建一个三角形,利用对边比邻边得到正切,然后利用反正切求出角度,最终让图形旋转该角度,下面是效果:但是好象有点问题,相信您也看出来了,因为我们绘制图形时,默...
阅读全文
posted @ 2010-03-31 22:00
菩提树下的杨过
阅读(3634)
推荐(0)
摘要:
先来看简单的单个按键捕获: 再来看下类似: A + B + C 的这种组合键捕获:先分析一下过程,比如用户按下Ctrl + A 时,实际上是先按下Ctrl键,同时触发KeyDown事件,然后在Ctrl不放的同时,再按下A键,再次触发KeyDown事件,然后松开(触发KeyUp事件),这是一个顺序的过程。思路:在用户按下键且尚未松开任何键时,可以考虑用一个数据,把本次按下的所有的键值都存储起来,然后...
阅读全文
posted @ 2010-03-31 13:30
菩提树下的杨过
阅读(1631)
推荐(1)
摘要:
特性(Attribute)是微软在.Net中自创的一种新技术,对于很多初学者来讲,特性一直是一块难啃的骨头。既然弄不懂,那我们就暂时绕过它吧,回想一下我们在写代码时通常都要求写注释,为了是让别人或自己以后能看得懂,但是这个注释是写给“人”看的,突发奇想一下:我们能不能写出一种注释,给c#编译器看,比如我们在某些代码上打个标记,让编译器看到这些标记后,做出不同的反应?其实.....
阅读全文
posted @ 2010-03-30 15:18
菩提树下的杨过
阅读(969)
推荐(1)
摘要:
先直接看代码吧:这段代码很简单:B继承A,然后定义了一个A中的同名方法Method1,编译能通过,但是会提示警告:'ConsoleApplication1.B.Method1()' hides inherited member 'ConsoleApplication1.A.Method1()'. To make the current member override that implementa...
阅读全文
posted @ 2010-03-30 11:31
菩提树下的杨过
阅读(2112)
推荐(2)