Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Content Count

  • Joined

  • Last visited

Community Reputation

11 Newbie

About fripi

  • Rank
    Advanced Member
  • Birthday 03/27/1978

Contact Methods

Profile Information

  • Gender

Recent Profile Visitors

3,000 profile views
  1. 🤦‍♂️ oh yeah sorry 🙈 thanks for your time, makes all sense
  2. Thanks, I'm trying it, and it works but... only one time, I just copied the code to animate and compared to your codepen, everything seems the same but it only works at the first mouse over, than nothing anymore... But I have a warning in my console: And when I use your next version of the plugin I have another warning:
  3. Well that's exactly the problem, there is no x property in my code : http://www.sharpness.be/demo/tint_test/ I have one background plane, the button with text and that's all, nothing more... I copied everything from animate to codepen, used the same libraries hosted by google and I see the error in my browser console, not in the codepen one https://www.dropbox.com/s/p63lad4mgecyu9u/tint_test.zip?dl=1 Also it's Animate 2019, not the last version which has to many problems, I have to use it for this client
  4. Hi everyone, working on a banner, need some tint change with mouse over, I already used it in the past but not since gsap 3 and I have this error message. Now it's in animate so the code isn't always the easiest to read, so I just paste here the code I used (on line 110 in the codepen) stage.enableMouseOver(); var root = this; gsap.registerPlugin(EaselPlugin); canvas.addEventListener('mouseover',overHandler,{ once: true, passive: true, capture: true}); function overHandler(){ canvas.addEventListener('mouseout',outHandler,{ once: true, pas
  5. But the latest version of createjs doesn't work well with that version of adobe animate canvas, I don't see errors in my console with my version the speed is right and amount of rectangles to, in your adapted version it doesn't seem to take in account my setinterval/clearinterval 🤔 just trying to understand what's happening and to optimise my noobie code. But all in all it seems to work : http://www.sharpness.be/demo/202002_supernova/
  6. Indeed seems to work just by adding init() at the bottom, great! I already called createjs in my codepen, strange how it reacts in yours, way to many objects compared to mine, I got max 48 green rectangles and in yours it seems endless
  7. So I did something in canvas very simple to start just putted a rectangle, duplicated that in a circle ans animate the scale of each But I try to figure out how to put it in codepen, I linked to createjs and tweenmax, then I copied the index.html body in "html" and all the index.js in "js" but it doesn't seem to be enough : https://codepen.io/fripi/pen/gOpMJxr Archive.zip
  8. Hi Zach, I produce banners usually in DOM or with Animate using exclusively GSAP, as I started using it since the beginning in flash years ago. But a friend asked me that, as he want's that kind of animation in background of his site (wordpress I think) and so it must be responsive for desktop and mobile, but as I never do websites, and never did such kind of animation... I was curious about performance, so I'll try in canvas (tru Animate) but then I can't do a codepen 🤔 Thanks for your answer and the link to your article, will read it tomorrow!
  9. Hi everyone, I need to make a responsive "tunnel" animation, based on primitive forms. Visually it's pretty simple but I admit don't know where to start, I'm no JS master at all. I have a video that shows exactly what I try to do : https://youtu.be/ClsdqojQ4hM Has anyone an idea, a simple code to achieve that? Thanks
  10. Great, thanks Carl, indeed much easier than what I had ?
  11. Hi, first of all sorry there will not be a codepen as it's specific to Animate CC. I'm not very experienced in canvas coding and particle effects... so I found some code and tried to adapt it to work in A.CC, you'll find the project attached. Now my questions are : how get rid of the trail, as it draws a new circle every time and doesn't delete the old one, I don't get how to do it in the code. wouldn't it be easier with a TweenMax for each particle to move around, and remove this draw update that is used now? But how to do it? again i'm lost in this
  12. Why don't you just add all this in the template? At the same time you can add some borders, to do so go after the div "dom_overlay_container" and add: <div id="b1"></div><div id="b2"></div><div id="b3"></div><div id="b4"></div> <a href="javascript:window.open(window.clickTag,'_blank');void(0);" ><div id="bgexit"></div></a> And in the header add some styles: <style> #animation_container{ position: relative; } #b1{ position: absolute; width: 100%; height: 1px; top:0px; left:0px; background-
  13. Hi, I would love to use Carl's solution in a banner, but pixi js isn't a DoubleClick hosted JavaScript librarie, so is it still possible without pixi? I really don't know much of canvas
  14. As Somnamblst said it is very vendor specific, some vendors needs 2 banner files for expandables so for them usually you won't be able to control the animation, they maybe give you some options when uploading and configuring the ad. Others like to have it all in 1 with different divs so there you could just animate the divs with gsap but you'll need to implement some API functions for the metrics...
  15. ok I found how, I stop it in 2 steps, first I stop emitting particles after 13s but the loop continues to run so that the existing particles can vannish then I stop the loop after 15s: var start = null; function renderSmoke(timestamp) { if (!start) start = timestamp; var progress = timestamp - start; //console.log(progress); var len = parts.length; ctx.clearRect(0, 0, canvas.width, canvas.height); while (len--) { if (parts[len].y < 0 || parts[len].lifeTime > maxLifeTime) { parts.splice(len, 1); } else {