/ Published in: ActionScript 3
Demo + FLA Download:http://www.adamcoulombe.info/lab/as3/PolkaDot-Hover-Repulsion-Effect.html .................. This demo uses Arnaud Icard's Traer AS3 port for physics to simulate repulsion. Each polka-dot will be repelled from the polka dot that you have hovered over.
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
import traer.physics.Attraction; import traer.physics.Particle; import traer.physics.ParticleSystem; import traer.physics.Spring; import com.greensock.TweenLite; import com.greensock.easing.*; var s:ParticleSystem = new ParticleSystem(new Vector3D(0, 0, 0), .2); var repellerAttractedTo = null; var floats = new Array(); var anchors = new Array(); var repells = new Array(); var magnet = s.makeParticle(1, new Vector3D(0, 0, 0)); var repeller = s.makeParticle(4, new Vector3D(0, 0, 0)); for(var i=0; i< container.numChildren; i++){ var self = container.getChildAt(i); self.id=i; self.addEventListener(MouseEvent.MOUSE_OVER, spotOver); self.addEventListener(MouseEvent.MOUSE_OUT, spotOut); self.buttonMode=true; floats[i]= s.makeParticle(0.12, new Vector3D(self.x, self.y, 0)); anchors[i]= s.makeParticle(0.12, new Vector3D(self.x, self.y, 0)); anchors[i].makeFixed(); s.makeSpring(anchors[i], floats[i], 0.1, 0.1, 0); //s.makeAttraction(magnet, floats[i], 20000 , 0); repells[i] = s.makeAttraction(repeller, floats[i], -80000 , 0); } stage.addEventListener( Event.ENTER_FRAME, loop ); function spotOver(e){ repeller.position.x = mouseX; repeller.position.y = mouseY; repellerAttractedTo = e.currentTarget; repells[e.currentTarget.id].turnOff(); TweenLite.to(e.currentTarget,1,{scaleX:1.2,scaleY:1.2,ease:Elastic.easeOut}); repeller.mass=4; //TweenLite.to(repeller,0.5,{mass:4}); } function spotOut(e){ repellerAttractedTo = null; TweenLite.to(e.currentTarget,1,{scaleX:1,scaleY:1,ease:Elastic.easeOut}); //repeller.mass = 0; //repells[e.currentTarget.id].turnOn(); TweenLite.to(repeller,0.01,{mass:0.1, onComplete:repellOn,onCompleteParams:[e.currentTarget]}); } function repellOn(obj){ repells[obj.id].turnOn(); } function loop(e){ s.tick(1); magnet.position.x = mouseX; magnet.position.y = mouseY; for(var i=0; i< container.numChildren; i++){ container.getChildAt(i).x = floats[i].position.x; container.getChildAt(i).y = floats[i].position.y; } if(repellerAttractedTo){ repeller.position.x = repellerAttractedTo.x; repeller.position.y = repellerAttractedTo.y; } }
URL: http://www.adamcoulombe.info/lab/as3/PolkaDot-Hover-Repulsion-Effect.html