Search the Community

Showing results for tags 'tweenjs'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 7 results

  1. I have following tween I used to move an image in my game coords = { x: 0, y: 0 }; tween = new TWEEN.Tween(coords) .to({ x: 700, y: 200 }, 2000) .onUpdate(function() { cardImg.position.set(coords.x, coords.y); }) .onComplete(function(){ redoTween(); }) .start(); function redoTween() { cardImg.position.set(0, 0); tween._valuesStart = { x: 0, y: 0 }; tween._valuesEnd= { x: 700, y: 0 }; tween.start(); } This works as expected. I wanted to re-use the same tween to move the image to a different location. I would like to update "coords" to new location and; call say; tween.start(); Is there a way to do this? What I noticed was I can only use the it once.
  2. I am developing a game in which i have to click an image .after click it will flip and show prize after that i have to move this image and prize towards prize-board.during this movement i have to scale these images to fit into prize-board slot .how to solve this problem. please help
  3. I want to do the same animation for bending card but unable to do so using css and border-radius property. Is there any property or method by which we can make it happen.. Plz help me regarding it.. card folding (1).mp4
  4. i am not able to control the css properties for animation using Tweenjs , finding difficulty in adding it. Suggest how could i achieve it. I want to control border radius css property of css.
  5. Hi, I manage to figure out how to tween a button's alpha from 1 to 0.5, using tweenjs. Now I can't seem to get it to jump to a certain location after the alpha is 0.5: this.coverBtn.addEventListener("click", coverBtnfadeOutClick.bind(this)); function coverBtnfadeOutClick() { createjs.Tween.get(this.coverBtn) .to({ alpha: 0.5 }, 100, createjs.Ease.none); if (this.coverBtn.alpha == 0.5) { this.coverBtn.x += 100; } } I usually just use onEnterFrame for AS2 in Flash era. How do I do that for html5?
  6. Anyone know how to define a repeat count for a tweenJS tween (using easeJs framework) ? The only option I can currently find is {loop:true} which causes infinite looping. //my code var solidsAnim = createjs.Tween.get(icon,{loop:true}) .to({y:solidOriginalY - 50}, 600 ,createjs.Ease.SineIn) Thanks !
  7. Recently discovered that there's a v4 of the wonderful PIXI.js. An hour or so of font- & generateTexture-refacturing and I'm in the clear, except for the tweens. The tweening library that I'm using is Tween.js ( ) which has been working great for me so far. Apparently, in v4 there's been some changes to how the position, scale, pivot and probably some more values are being set, rendering most of my tweens unable to ...tween. Tweening the alpha works fine, as it seems to be unchanged. According to the v4 source, the affected values all have this comment in common: * Assignment by value since pixi-v4. ( ), which is what prompted my current, albeit unsatisfactory, solution. To illustrate I'll show two examples of code, first one that works in v3 but not in v4 and then my current solution. This code example is no longer able to set the x position in v4: new TWEEN.Tween(stage.position) .to({ x: value }, 500) .start(); However, a solution is to use the onUpdate()-function of Tween.js and set the position manually with a temporary object acting as the target. This code example using onUpdate() works with v4: var temporaryObject = { x: stage.position.x }; new TWEEN.Tween(temporaryObject) .to({ x: value }, 500) .onUpdate(function() { stage.position.x = this.x; }) .start(); Which is a relief (been a rough day), but it also means that I have a lot of tweens to refactor in a tedious manner. My question is if there's a better way to refactor these old tweens that requires less change? I'm not super experienced with the high level of code that's in the source.