Jump to content
GreenSock

Search the Community

Showing results for tags 'firefox'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

  1. Hello I was dealing with an issue in Firefox Mobile Browser, where it would not honor overflow hidden when 3d transforming its child. So the parent that had overflow hidden, would have its childs 3d transforms display outside the parents bounds. There is an opacity: 0.99 hack that you can add to the parent your transforming, but in some instances it will cause the layout to get pushed down, and is very very frustrating to debug. .targetElementThatHas3dTransforms { opacity: 0.999; } Firefox Mobile Browser does not honor overflow hidden when using or animating 3d transforms on its child. So i came up with another hack which i find that worked. Apply this to your style sheet: * { outline: 1px none transparent; } I also did some other tests, and found out that if you add this to the element your animating, that uses 3d transforms.. it should also fix that overflow hidden bug: .targetElementThatHas3dTransforms { outline:1px none transparent; } Also if you want to apply via javascript and only apply on FireFox Mobile Browser you can do this: // check for FireFox var isFF = !(window.mozInnerScreenX == null); // check for mobile touch support var isTouch = ('ontouchstart' in document.documentElement); // check for FireFox Mobile Browser (FireFox and Mobile Touch) if(isFF && isTouch){ TweenMax.set($('.targetElementThatHas3dTransforms'),{'outline':'1px solid transparent'}); } I found out the Desktop version of Firefox doesnt like the outline on the element that has the 3d Transforms. And animates slow and blocky in some cases, So above we only add the hack when in Mobile view.. from what i noticed in my tests. This solved the Firefox Mobile Browser overflow hidden bug. Im not sure why the Firefox Mobile browser behaves this way. But I thought i would share this, so if anybody runs in to this same issue, it can provide some help.
  2. We have created a pretty crazy scrolling animation (link below). As you scroll it triggers zooms, opacity changes and movements, and the animation is pinned, so it responds quite differently than most scrolling websites that use a parralax visually. It seems to be testing really well across most platforms, but seems to run into some big issues in firefox exclusively for a macbook. Firefox works perfectly on pc laptops, desktops, and mac desktops. I am thinking it may have something to do with the trackpad, but still can not identify the issue. Any thoughts? Appreciate it in advance! www.housingopensdoors.ca/DEV_merged
  3. Hi, The firefox fix in the current code that addresses a bug in transform could be improved. It changes the top value but if I have an element positioned with bottom it breaks my layout. One fix could be just checking if bottom is set and change the bottom value instead. Code I'm refering to: if (_isFirefox) { //Firefox has a bug that causes transformed elements to randomly disappear during (or after) animation unless a repaint is forced. One way to do this is change "top" by 0.05 which is imperceptible, so we alternate back and forth. Another way is to change the display to "none", read the clientTop, and then revert the display but that is much slower. The bug is present in at least Firefox 17 and 18 top = _getStyle(targ, "top", null, false, "0"); n = parseFloat(top) || 0; sfx = top.substr((n + "").length); t._ffFix = !t._ffFix; targ.style.top = (t._ffFix ? n + 0.05 : n - 0.05) + ((sfx === "") ? "px" : sfx); } Thanks
  4. Hello. Firstly, I have to say thanks for a great package - I've been using it in Flash for quite a while and am now using the JS version. My problem is that in FF19.x, elements that I've rotated with the following line disappear once the rotation is complete: TweenMax.to(vObjString, 0.6, { css:{ rotation:-90, transformOrigin:"57px 0px" }, ease:Bounce.easeOut, onStart: mPlaySound, onStartParams: ['flag_lift'] }); vObjString is a string list of elements e.g. "a#game_flag_1, a#game_flag_2". Intermittantly they re-appear, some seconds later, but mostly they stay hidden until I use Firebug to toggle a css property eg. overflow:hidden on the containing div. Removing overflow: hidden from the CSS rule and refreshing the page has no effect - they still disappear after rotating - other than showing the previously hidden overflow (!). Everything works properly in Safari, Chrome, IE9 & 10 and it used to work in FF18 and below. I realise that this is most likely something that MOZ have changed in FF19, but I wondered if anyone else has had any similar problems, or has any ideas on a work-around? Thanks v. much. Dale
  5. I know Firefox is notorious for having choppy playback. If I'm animating an image down the screen using the "top" property, using roundProps definitely helps make it less jerky. I think Firefox doesn't like things sitting on half-pixel values. How do I accomplish the same thing using the "scale" property? When I try, I think the scale value is properly rounded, but I'm still getting choppy playback. I'm not sure what's going on under the hood, but it seems like even if the scale value is rounded, the item I'm scaling will potentially still have half-pixel values for its width/height/marginLeft/marginRight/top/left (or however it's technically rendered behind the scenes). Anyone have any tips here? Thanks!
  6. Hi, I was implementing a tween based on CSS3's background-size today. That would map to "backgroundSize" as defined in CSSPlugin.js. However, the tween doesn't work in the latest Firefox. While it works perfectly in the latest Chrome. I digged down until I found about this condition in _parsePosition function in CSSPlugin.js: _parsePosition = function(v, o) { if (v == null || v === "" || v === "auto") { v = "0 0"; } Debugging this, I found that 'v' was passed in as 'auto' in Chrome. But it was passed in as 'auto auto' instead in Firefox. Since 'v' was not changed to '0 0' this leads to parsing problem resulting in 'NaN' in o.ox. And thus the effect doesn't work. My TweenMax code looks like something along these lines: controller.addTween( chart.offset().top, TweenMax.fromTo($('.bub', chart), .25, {css:{opacity:0, 'letter-spacing':'30px', backgroundSize:'0% 0%'}, immediateRender:true, ease:Quad.easeInOut}, {css:{opacity:1, 'letter-spacing':'0px', backgroundSize:'100% 100%'}, ease:Quad.easeInOut} ), 0, -350 ); I patched CSSPlugin.js locally so that it now handles 'auto auto' case. The backgroundSize transition now works correctly on my machine. if (v == null || v === "" || v === "auto" || v === 'auto auto') { v = "0 0"; } Hope this helps. Not sure of any proper channel to report issue for TweenMax? Natthawut
  7. I know Firefox is notorious for having choppy playback. If I'm animating an image down the screen using the "top" property, using roundProps definitely helps make it less jerky. I think Firefox doesn't like things sitting on half-pixel values. How do I accomplish the same thing using the "scale" property? When I try, I think the scale value is properly rounded, but I'm still getting choppy playback. I'm not sure what's going on under the hood, but it seems like even if the scale value is rounded, the item I'm scaling will potentially still have half-pixel values for its width/height/marginLeft/marginRight/top/left (or however it's technically rendered behind the scenes). Anyone have any tips here? Thanks!
  8. Hello Rockstarrs, I wrote this dynamic mp3 visualizer almost a year - and it worked wonderfully. Then recently I went back to it and it stutter steps and drops frames. The only things that have changed on my end, Mountain Lion (but i noticed it even before with Lion), FP11.3. So I recompiled the SWF, opened the SWF and everything as fine! Then opened it in the browser - same issue… Uninstalled Flash Player, reset Safari, Chrome, FireFox, repaired disk permissions systemwide, reinstalled Flash - no love. Made sure I had the most current version of GreenSock and swfObject, still nothing better... Attached are screenshots of exactly what I'm talking about, and here's a link to the project live. Let me know if you're seeing everything correctly, or if yours, like mine is slicing and dicing the visual... http://joelhackney.name/spectrum/ Thanks! -Joel
×