kanderson450

This is what I'm seeing in the IE Developer Tools:

Hi Jonathan, The video element is in both of Blake's codepens at lines 122 & 123 of the JavaScript respectively. Let me know if you're able to find it. Thanks!

The first CodePen that Blake put together accurately represent what I'm seeing in my full GitHub sample project. Blake's 1st CodePen showcasing the problem in IE: http://codepen.io/osublake/pen/MeKOOE?editors=0010 The problem occurs when the Video Player is transitioned out with a move to the left and a fade out. Instead of a smooth move of the Video element towards the left, it nearly instantly is moved entirely to the left edge of the window and remains there until the duration completes. For some reason this only happens in IE. Blake's 2nd CodePen with slight rotation, no issues: http://codepen.io/osublake/pen/PzZEVQ?editors=0010 Adding that slight rotation seems to mitigate the issue. So now the question becomes, where does this problem live? And what is it about the rotation workaround that seems to help?

Yes, React does abstract away the DOM and provides a Virtual DOM that makes re-renders really fast. However when using libraries, such as Greensock, that need to manipulate the DOM directly, they do provide an API and lifecycle hooks that let you get back to business as usual for all intents and purposes. That's not to say that there couldn't be a React specific issue; it's entirely possible. I just haven't been able to pinpoint anything yet. It seems to work fine in Chrome and Firefox, but I.E. is struggling. Yes I can try to make a simpler CodePen demo tomorrow. I hope I'm able to reproduce it. In the meantime if anyone's curious, take a look at my GitHub repo. Thanks y'all.

I'm having trouble with TweenMax and IE. My usage is very basic at the moment, I'm only calling TweenMax.fromTo(). It works well in Chrome & Firefox, but in IE it is really jerky. My supposition is that there's something wrong with my code but I'm not sure what. https://github.com/kanderson450/react-gsap-issue I've linked to a sample project on GitHub that illustrates the issue. Sorry it was a little too complicated for CodePen. To run the demo simply use the following commands: npm install npm start Then check localhost:8080 The first component is a Table and the second component is a Video Player. Click on any Table row to transition the Table out and bring in the Video Player. Click the Button to transition out the Video Player and bring back in the Table. Notice the Video Player transition in IE is not smooth at all. That is what I'm struggling with. Your guidance is really appreciated. Tested on Windows 8.1 with IE 11.