Jump to content

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


  • Content Count

  • Joined

  • Last visited

Community Reputation

3 Newbie

About teejay_hh

  • Rank

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Wow those 2 tweak made this run without any studder at 60 frames, thanks so much. I used will-change in the past but I couldn't remember it anymore.
  2. I replaced the - quickSetter with normal to tweens -> gsap.to(this.hills, {duration: 0.1, x: s/5 }) gsap.to(this.clouds, {duration: 0.1, x: s/8 }) which seems to make a big difference. Not perfect but closer to what I want.
  3. Hello I have a question performance. I wrote small horizontal slider which also moves 2 background images. The following code shows my slider implementation. I wrote this for my team so there are few more comments which dont assume gsap knowledge. define(function (require) { const gsap = require('gsap/gsap.min').gsap const Draggable = require('gsap/Draggable.min').Draggable const InertiaPlugin = require('gsap/InertiaPlugin.min').InertiaPlugin gsap.registerPlugin(Draggable, InertiaPlugin) /** * The slider class creates a draggable slider which uses gsap's draggab
  4. Hello, I am wondering if there is a nice and simple way to set all tweens duration of a timeline to 0 so it does not animate anything but instead applies the props instantly and other timelines. Essentially go to the end without animation anything. I created a codepen which uses seek to do this sort of thing, would this be the right approach or is there something more elegant?
  5. Thx, mikel but I really prefer my solution as it does exactly what I expect scrollto to do in first place. Adding additional space to the bottom of a scrollable area is not great, imagine this on a website with a fixed header its simply not working like that. I really appreciate your input, but you suggested exactly the one thing, I mentioned in my first post , that didn’t want to do. Have a great weekend Thomas
  6. Hello mikel, your suggested solution is simply not working in a dynamic context, which I didn’t make quite clear, the search input field could have given it away though. This is why this can’t be a pure css solution. So I had to find a difference solution. And the more I think about it the more I think that the offsetY behaviour is buggy in that regard, but it might not be trivial to fix. Anyway the solution above is workable and easy enough to implement. Cheers everyone. Have great weekend... soon.
  7. For that I would have to measure the ul for its height. Adding a margin-bottom to the ul of the 'offsetY' value would do the trick, but its uggly
  8. thx for the suggestions, I dont really want to set height or margin on any element. For this case it really only affects the last entry. I might be able to get away the `max` solution for the last entry { y: 'max', offsetY: 0 } I kind of still think scrollTo should have the smarts to do this by itself. The same happens for fixed elements and window scroll btw. Try scrolling to the last item
  9. Hi, I have build a really small component (see codepen) which is a list of entries with the first being sticky element. I would like to scroll to an entry which seem slightly buggy due to the sticky element, or I am doing something wrong. If you click on the the last element you will see what the problem is. It works well for entries where scrolling is required, but if en entry sits at the end (entry 9 for instance), where we can't scroll to, then the scroller does not scroll to very end but leaves the gap at the bottom (offset of 30px). Is there a way around this (without adding a margin-bott
  10. Totally, I am happy to share. Love gsap, keep up the amazing work.
  11. Ok I got something. I created a shim which created the wiggle namespace. /* global define, self */ (function() { var plugins = { 'CustomEase': CustomEase, 'CustomWiggle': CustomWiggle, }; define('wiggle', [], function() { 'use strict'; return plugins; }); })(); Then you can add the the imports to the ember-cli-build.js file app.import('vendor/CustomEase.min.js') app.import('vendor/CustomWiggle.min.js') app.import('vendor/gsapShim.js', { exports: { 'wiggle': ['CustomWiggle', 'CustomEase'] } }) And then you can use it like this i
  12. window.com.greensock.easing.CustomWiggle.create('myWiggle', { wiggles: 6 }) this works, but its really not a fantastic way to do this in ember. I will keep dabbling and see if I can get it to work in more emberish way. Thx a lot for your help.
  13. That package is a community addon which makes it pretty easy to add just TimelineMax or specific easting to the ember build. I have not tried it without the addon, which would still leave me with what would I need to import to actually use Tweenmax for instance. I tried this https://guides.emberjs.com/v2.13.0/addons-and-dependencies/managing-dependencies/#toc_amd-javascript-modules app.import('vendor/CustomWiggle.min.js', { exports: { wiggle: ['CustomWiggle'] } }) and then import { CustomWiggle } from 'wiggle' But no luck.