olleka

Ok, I understand. Thank you! Regards Olle

Hi. Maybe a simple question. But how do I start and stop a HTML5 video from a button in an HTML5 ad? I have looket in the forum but found nothing so simple Regards Olle

Hi Well it's a bit strange. Because if I do like this it works wit y transformation. var rad10 = new TweenMax.to('.knapp-tusen', 1, {y: '800'}); var scene10 = new ScrollMagic.Scene({ triggerElement: "#rad10", duration: 800, offset: 50, reverse: true}) .setTween(rad10) controller.addScene([ scene10 ]); But if I do like this the button is jumping up and down like a crazy rabbit. Scroll down to Tunity Organizer section go on the left button Appar an scroll down a bit to see te jumping. Just curious what is causing this ... (With paddingTop it is ok.) $('.knapp-tusen').each(function(){ var currentStrong = this; var tweenStrong = new TweenMax.to(currentStrong, 1, {y: "1000px"}); var scene = new ScrollMagic.Scene({triggerElement: currentStrong, duration: 800, offset: 50, reverse: true}) .setTween(tweenStrong) controller.addScene([ scene ]); }); Regards Olle

Hi thank you for answering. I got i working. Using ".tillbaka10" or whatever I like as a classname for all the buttons. Misstake I made was thinking the trigger could not be the button itself. One thing though. I could not use {y: "800px"} or {top: "800px"} because of a terrible flickering and had to use {paddingTop: "800px"} Maybe a bug with the ScrollMagic plugin. I check with the author. $('.tillbaka10').each(function(){ var currentStrong = this; var tweenStrong = new TimelineMax().to(currentStrong, 0.25, {paddingTop: "800px"}); var scene = new ScrollMagic.Scene({triggerElement: currentStrong, duration: 800, offset: 50, reverse: true}) .setTween(tweenStrong) controller.addScene([ scene ]); }); Regards Olle

Hi. I have a website here. http://olle.dyndns-ip.com/tunity/ I'm using ScrollMagic to controll the start and stop of the blue buttons in the side of some of the sections. It is working good. However I want to make the code more slim and effective. Like it is now if I add one more section I have to create one more tween and one more scene. So the code I have for the moment is. var rad1 = new TweenMax.to('.fordjupning1', 1, {y: '150'}); var rad2 = new TweenMax.to('.tillbaka2', 1, {y: '450'}); var rad3 = new TweenMax.to('.tillbaka3', 1, {y: '1050'}); var rad4 = new TweenMax.to('.tillbaka4', 1, {y: '650'}); var rad5 = new TweenMax.to('.tillbaka5', 1, {y: '450'}); var rad6 = new TweenMax.to('.tillbaka6', 1, {y: '450'}); var rad7 = new TweenMax.to('.tillbaka7', 1, {y: '450'}); var rad8 = new TweenMax.to('.tillbaka8', 1, {y: '800'}); var rad9 = new TweenMax.to('.tillbaka9', 1, {y: '800'}); var rad10 = new TweenMax.to('.tillbaka10', 1, {y: '800'}); var scene1 = new ScrollMagic.Scene({ triggerElement: '#rad1',duration: 200, offset: -50, reverse: true }) .setTween(rad1) .addIndicators() var scene2 = new ScrollMagic.Scene({ triggerElement: "#rad2", duration: 400, offset: -50, reverse: true }) .setTween(rad2) .addIndicators() var scene3 = new ScrollMagic.Scene({ triggerElement: "#rad3", duration: 1000, offset: 50, reverse: true }) .setTween(rad3) .addIndicators() // and so on controller.addScene([ scene1, scene2, scene3, scene4, scene5, scene6, scene7, scene8, scene9, scene10 ]); I have trie the code from this question (edited for my website) #215 But it does not do it. $('.tillbaka10').each(function(){ var currentStrong = this; var tweenStrong = new TimelineMax() .to(currentStrong, 1, {y: '800'}); var scene = new ScrollMagic.Scene({triggerElement: currentStrong, duration: 800, offset: 50, reverse: true}) .setTween(tweenStrong) .addTo(controller); }); So how can I make this in an efficient way? With classes as the trigger? Or how is it done? Regards Olle

Hi. I found this script (se below) that I need for moving an object attached to a eliptical path. The scrip itself works ok. But what I love to do is to add some smooth tween when mouse is stopped. Or even better have a greensock soulotion for a carousel tweening Maybe with combination of beizer and dynamicProps? I did read about the circle2D class some. But This needs to be As2 because it targets flashplayer8 at minimum. I would offcourse consider a Club memberhip if ther is a way with As2 Regards Olle var rX:Number = 200;// radius1 var rY:Number = 100;// radius2 var ang:Number = 10; // angle to rotate ellipse // var zeroSector:Object = sector(0, rX, rY, ang); function sector(degree:Number, radiusX:Number, radiusY:Number, angle:Number):Object { // coordinates of a point on ellipse var cx:Number = radiusX * Math.cos(degree * Math.PI / 180); var cy:Number = radiusY * Math.sin(degree * Math.PI / 180); // rotation of system of coordinates var xx:Number = cx * Math.cos(angle * Math.PI / 180) - cy * Math.sin(angle * Math.PI / 180); var yy:Number = cx * Math.sin(angle * Math.PI / 180) + cy * Math.cos(angle * Math.PI / 180); return {x:xx, y:yy}; } function objPosition():Void { // detecting coordinates of a clip var ratio:Number = rX / rY; var anAngle = Math.atan2(this._parent._xmouse, this._parent._ymouse) + ang * Math.PI / 180; var deg:Number = 90-(Math.atan2(Math.sin(anAngle), Math.cos(anAngle) * ratio)) * (180 / Math.PI); var _sector:Object = sector(deg, rX, rY, ang); this._x = _sector.x; this._y = _sector.y; } // draw ellipse this.createEmptyMovieClip("mc", 0); mc._x = Stage.width / 2; mc._y = Stage.height / 2; this.mc.lineStyle(0, 0xDDDDDD); this.mc.moveTo(zeroSector.x, zeroSector.y); for (d = 0; d <= 360; d += 5) { var _sector:Object = sector(d, rX, rY, ang); this.mc.lineTo(_sector.x, _sector.y); } // create draggalbe clip mc.createEmptyMovieClip("drag_mc", 0); mc.drag_mc.lineStyle(50, 0x007722, 100); mc.drag_mc.lineTo(0, 1); mc.drag_mc._x = zeroSector.x; mc.drag_mc._y = zeroSector.y; mc.drag_mc.onMouseMove = function():Void { this.onMouseMove = objPosition; this.onRelease = this.onReleaseOutside = function ():Void { delete this.onRelease; delete this.onReleaseOutside; delete this.onMouseMove; }; };

Yes! That works like a charm Regards Olle

Hi. Thanks for answering. Slight missundertanding because I explained it poor. The goal is to open a fullscreen window. I want to tween a photo in the fullscreen window. So I need to scale the photo proportional to keep it look wierd in a wide screen for instance. If i go just TweenLite.to(mc, 1, {_width:Stage.width, _height:Stage.height}); the image gets very wide in a wide screen. It would work for a backround or similar. But this image needs to have the same proportions in every screensize. So I guess it' the height of the picture that desides what percetage to scale the image. So what I ended up with now that works somewhat, but not perfect is that I put the mc to be tweened inside a container mc. container._width = Stage.width/2 container._height = Stage.height container._xscale <= container._yscale ? (container._xscale = container._yscale) : (container._yscale = container._xscale); // keeps boy proportional TweenLite.to(container.boy, 0.75, {_xscale:60, _yscale:60, delay:0.7, ease:Elastic.easeInOut}); Maybe there is a smarter way i'm sure Regards Olle

Hi I have a movieclip that I want to tween fro 0 to 100 % of the screen size when the tween runs. I have set it up so that the mc scales with the screen. boy._width = Stage.width/2 boy._height = Stage.height/2 boy._xscale <= boy._yscale ? (boy._xscale = boy._yscale) : (boy._yscale = boy._xscale); // keeps boy proportional But now I want to add a tween from 0 to 100% wit a delay, dependent of screen size. How would I do that? I did read about AutoFit area but don't know how to or where I can find out more. My actionscript is rather limited I use AS 2 in this project. Regards Olle

Ok, thank you. I'll try to stay away from long scrolling content in banner ads in the future. Or try to convince the client to accept another soulution. Regards Olle

Hi Thank you for the reply! What about UdateAfterEvent? If I make a simple Setinterval function like setInterval(moveText, 1); function moveText() { texten._x -= 2; updateAfterEvent(); } The animation runs a little smoother. It stutters sometimes but it's better. http://www.olle.se.st/friendsofadam/test5.php It seems very cpu intensive though ... so I wonder if the banner will be accepted with SetInterval And how would I use that with TweenMax? Regards olle

Hi I'm doing a banner with a long text scrolling to the left. The spec for the banner is max 18 fps. But that gives very choppy movement, totally unusable. So I did som tests starting at 24 and then 31, 62 and 96 fps. http://www.olle.se.st/friendsofadam/test.php So obviously the faster the smoother. But on my macine (mac G5) i'ts still a little jerky. But that may be the flashplayer only manage around 40 fps? The question I have is: Is it possible to have a smooth scrolling with the low frame rates like 18 fps? I mean really smooth. Or should I convince the client to go for some other transition instead? Regards Olle

Ok, thanks! regards olé

Hi. I'm just new to TweenLite. This is what I have so far. stop(); import gs.*; import gs.easing.*; function doMyTween():Void { burkar._x = -912; TweenLite.to(burkar, 52, {_x:0, ease:Sine.easeInOut, onComplete:doMyTween}); } doMyTween(); But how do I disable the easing totally? If I leave out the ease:Sine.easeInOut I get a default easing I have alsso tryed ease:ease:NONE Regards Olle