Jump to content

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


  • Content Count

  • Joined

  • Last visited

Community Reputation

4 Newbie

About Violetta

  • Rank
  1. Thank you! Yes, that helps a lot! 1. In the preview version, the elements above the viewport are already shown. 2. With limitCallbacks: true the elements are not yet visible, but are faded in once when scrolling up. I think it's good that you have both variants. I have now decided on variant 2 until the new release has been released. Thank you!
  2. I would like the elements to be faded in only once, once they are there they should not be faded out and in again.
  3. I try my 1st steps in scroll trigger, but I have a simple problem. I can't show the problem with a codepen, so I've created a small example here: https://www.violetta.ch/example/scrolltrigger-testcase.html#test When I scroll down it works, the elements are faded in. But when I scroll up, nothing happens. If I remove "once: true", it works, but every time, but I only want it to fade in once. And yes I would like to solve this with CSS animation :-). What am I doing wrong? Or how can I solve that?
  4. If I want to toggle a class on another object, the class "undefined" is set instead of the one I want. Here the example: https://codepen.io/alsodenn/pen/WNrNNap
  5. I have it! I do not know why that was the "mistake", but no matter. What I have done: - removed all installed npm modules ("node_modules" folder) - removed package-lock.json - removed yarn.lock Then I did "npm install" again. And now it works wonderfully :-). Again thank you Dipscom for your help and patience!
  6. I have now created a reduced bundle. And the reduced bundle works as desired! HAHA Thus, the reason is somewhere else .. But now I can exclude one after the other ... Thank you for your patience. If I found out more and do not know further, I write here again :-).
  7. Hi Dipscom I know what you mean. The problem is, there is no error message :-). That's just strange. The only warning message is this during the gulp process: WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB). This can impact web performance. This is my first project with webpack :-), so my experience is limited. Before I invest hours and make a bundle (I do not know if that really helps, because there are a lot of dependencies), here's what it looks like right now: https://www.violetta.ch/t
  8. Hi Dipscom Thank you for your reply. What do you want to see? Here are snippets from the gulpfile: let webpackConfig = { mode: (PRODUCTION ? 'production' : 'development'), module: { rules: [{ test: /\.js$/, use: { loader: 'babel-loader', options: { presets: ["@babel/preset-env"], compact: false } } }] }, resolve: { alias: { TimelineMax: "gsap/src/uncompressed/TimelineMax", TweenMax
  9. Hi all I animated a few SVGs. Everything works as expected. Now we wanted to go live and I uglifyed the webpack JS code with gulp-uglify. But now the transform-origin of the animations are no longer correct everywhere. I put it this way: iconAnis.tl_icon3 = new TimelineMax({ useFrames: true, paused: true }); var tl_icon3_2 = new TimelineMax({ repeat: -1, paused: false }) .set('#wheel_big', { transformOrigin: 'center center' }) .from('#wheel_big', 100, { rotation: -360, ease: Power0.easeNone }); iconAnis.tl_icon3 .add(tl_icon3_1