ditorelo
Recent Profile Visitors
1,896 profile views
ditorelo's Achievements
1
Reputation
-
Sorry it took me so long to come back to this. Yeah, this works. One of the solutions I tried was saving the dimensions of the sprite prior to scaling and going from there (your solution is way more elegant though). Turns out I have another problem and that was regarding how IE8- sets the background position. I found this code somewhere on the Interwebs that addressed the problem. $.fn.backgroundPosition = function() { if(typeof(arguments) != "undefined" && arguments.length > 0) { if(typeof($(this).css("background-position")) != "undefined" && !$('html').hasClass("lt-ie9")) { //dirty drity ie8 (if <html> should have an appropriate class to identify browsers lesser than IE9) $(this).css("background-position", arguments[0]); } else { var bgPos = arguments[0].split(" "); if (typeof(bgPos.length) !="undefined" && bgPos.length < 2) { bgPos = Array("",""); } $(this).css("background-position-x", bgPos[0]) .css("background-position-y", bgPos[1]); } return $(this); } else { if(typeof($(this).css("background-position")) != "undefined") return $(this).css("background-position"); else return $(this).css("background-position-x")+" "+$(this).css("background-position-y"); } }; Thought I would share for the generations to come, even though it is not related to GreenSock (maybe plug-in in the next release I hear you say?). I'm still having other problems with IE, but now that I'm aware of how it deals with scaling I'll devise annoying work arounds. Thanks once again Greensock. You rock my GREEN SOCKS off (like Green day or something). Man, I'm so funny...
-
Hi Greensock universe, IE is giving me grief, as expected. After a day of fighting with this, I decided to come to you for a shoulder and some sound advice. We have an animation working BEAUTIFULLY in all browsers but IE8 (haven't even looked IE7 yet, not sure if I ever will). At one stage, our main character gets scaled down, which is done using the code below. TweenMax.to(user.sprite(), 1, { scale: 0.6, onStart: function() { //Kick spritesheet animation in } }); This character has a few different sprite sheets for it so it can walk and jump around the page. The sprite sheet animation is done with background-position management (this is NOT done using TweenMax). All browsers report the full width of the div that has the character in it, even when the element is scaled down (144px). We use this width to updated the background-position for the spritesheet animation. HOWEVER IE8 reports a different width as it scales the object down (86.4px final width), and, because the sprite sheet file is based on a 144px width, it all turns to custard. I attached an image of how the character looks after both the scaling and sprite sheet animations are completed. All other browser play ball with no problems what so ever. Any ideas? Help me please?
-
Hey Greensock, Would you considered marriage with a unknown person like me? I could marry you right now. Working like a charm. You charmer. Thanks you!
- 5 replies
-
- 1
-
-
- ie8 margin
- filter microsoft matrix
- (and 2 more)
-
Thanks for the reply, Greensock! Here's the reply to your questions: 1. We're using the latest version of TweenMax. 2. Objects are absolutely positioned. 3. No margin change before the animation whatsoever. 4. Animation is only vertical / horizontal, no other properties being updated. 5. http://jsfiddle.net/pkgbR/5/ -> This doesn't reflect my full code, but there's not much different going on apart from the fact that the clouds are a sprite with background-position set on the real code. This is the gist of it. Thanks once more!
-
Hi there, I read this forum front to back and can't find a solution for my problem. We're using the TweenMax pack on a animation and it works amazingly on Chrome, FF and Safari, as you would expect. Even IE9+ is a doozie and we're not having problems with that. HOWEVER, IE8 insists in not playing ball. So after a lot of debugging and fiddling around, I have two questions for you. 1) I notice that a few of the animations use "filter:progid:DXImageTransform.Microsoft.Matrix" while other will use use margin to move things around. Why's that? I can't find a pattern why TweenMax. The animations that use "filter" work fine. But... 2) The animations using margin don't. If I use "TweenMax.to" it disregards the current position of the element and starts from 0x0. The "from" values below are also disregarded and the animation starts from 0x0. TweenMax.fromTo(_cloud_small, 4.6, {css:{x:600}}, {css:{y:120, x:200}}); We've tried changing 'x' and 'y' to 'left' and 'top' and a whole bunch other things, but nothing seems to work. It is as if on onStart the the object's margin is set to 0 and the animation starts from there. Why, I ask you, WHY? I've spent a few hours on this now, and I can't understand the reason. Any clues will be most appreciated! Hug of the bear and thanks!
