Search the Community
Showing results for tags 'ios'.
Found 53 results
-
Hope someone can help me out here. I am doing a very simple y-axis rotation animation that works fine on desktop and Android, but does not rotate on iOS (Safari OR Chrome). Any ideas what I'm doing wrong? Thanks so much!
-
Hi GSAP Friends, Question/Observation/Bug: Working on a DrawSVG animation and was having some huge performance issues on iOS mobile. It turns out that adding a size directly to the SVG element was causing the issue (adding a size to a div wrapper helped eliminate the issue). Size on SVG pen (awful on iOS): http://codepen.io/ryan_labar/pen/wWqGZk Size on div wrapper pen (much better on iOS): http://codepen.io/ryan_labar/pen/mErPEK Any reason for this issue (am I doing something wrong)? Not needing to wrap an SVG in a div would really be idea. Is it a GSAP bug, or the fault of the browser (or both)? Thanks! **UPDATE** even with the div wrapper, performance isn't great on mobile, what should I do? From my understanding, resizing my SVG's viewbox/internals may help, but IDK if that will eliminate the problem, it's not exactly a huge svg file--size or otherwise
-
Hello, I trying to create a top navigation bar draggable on desktop and mobile but have some issue with the following case : Basically I need to have a container (bounds) smaller than the navigation bar (element) that I need to drag inside. You can have a look at the following jsfiddle. https://jsfiddle.net/biquetto/4th0sfp2/28/ Regards
-
Hello guys, I'm with a doubt in building an application. I have a home screen where there are multiple animations. The animations are made in SVG images. But the problem is that they are getting too slow and when they stop using scroll animate (in IOS) and are slower (on Android). Could someone tell me if there is any limit animations for a mobile application? or if it really works? Thank you very much in advance
-
Hi, I am using a combination of ScrollMagic and GSAP to achieve a scroll-based (100% height/duration) animation at the top of my page. Everything works great in Safari/Chrome/Firefox, but when I test on mobile (iOS) the animation is all screwy. Seems to be an issue with overflow and/or viewport height, but I cannot seems to find a fix. Apologies in advance if this is an issue related to ScrollMagic (not GSAP), as I am still getting acquainted with both. Live site can be found here: http://aigasd.github.io
-
Hello all, I am new to GreenSock and the forum. I must say I am loving it! We are doing a Cordova mobile app with React. We started using GSAP for all the animations. This works great in Ripple and also physical Android devices. Even older Android devices, which we were sure were going to be a problem, everything is running super smooth. The problem is with iOS devices. We have tried iPhone 5S with both iOS 8.x.x and 9.x and also iPhone 6 and 6 Plus and on all of them performance is really bad. Animations are chopping up and stuttering all over the place. I tried adding the translate3d transform and also adding force3D to the options object and nothing helps. In the codepen the red div slides down more than one screen length and I know this is a lot of pixels to animate, but what works fine on an S3 I would expect to work better on an iPhone 6. Any tips for me? Thanks!
-
Hi wonder if someone could help me. I have a simple 3d rotation of a red circle on Y axis. It's working fine everywhere except on Safari and iOS8. The issue is that on safari, when it rotates it seems to be missing one half of the circle. Have attached the PEN - Pen: http://codepen.io/sonamtsu/pen/xGoRzw Page: http://codepen.io/sonamtsu/full/xGoRzw/ Any help would be greatly appreciated. Thanks
-
I'm not sure if it's a bug but the latest Chrome under iOS 8 (old iPad2) behaves different than Safari while swiping/dragging content. Can be something in GSAP as well but guess it's Chrome for now. If you drag/throw a page while your finger leaves the screen the throwprops plugin detects you left and just does what it's supposed to do. Well, that's for iOS Safari, Chrome does the same except if you leave the screen while you swipe to the top and leave screen while swiping over the it's browser bar. If you do so the draggable/throwprops will just stop moving until you drag within the screen again. It's annoying since with my navigation you have to swipe/drag/throw from bottom to top to scroll the site. Works perfectly if you keep you fingers on screen. I made a little page which shows the problem: http://ozboz.nl/dragger/ It's like the browser bar gets the focus or something. Hope someone can give me a fix (or Google for that matter).
-
I am using GSAP along with a ScrollMagic plugin to time my animations using the user scroll. Everything works great on desktop, animations are smooth and look nice. But when I load the site on tablet and mobile issues start to show up. I have an iPad and a Galaxy S4, and the galaxy is performing much better than the iPad is. On scroll for the Galaxy there is a short jump at the start, past that the animations are a bit slow but work in general. When it comes to the iPad, the animations are nonexistant... on scroll everything locks up and moves for the scroll, then it seems to reload and moves everything to where they should be instantly. There is no tweening or easing happening and creates a very poor experience on tablet. Im looking for a way to improve performence on mobile / tablet and allow tweening and easing to happen at all on tablet. Thank you
-
Hi, I'm currently working on an iOS app using Flash CC and Adobe AIR and have been loving using greensock to create great tweens.. I have a shocking green membership which is great! Anyway, the majority of the app will be using illustrations. I have split these into three layers each (background, foreground & middle) and want to use the iPad gyroscope to move these separate movieclips around the stage to give a parallax 3d effect. Is it possible to do this using the greensock code with easing enabled? Or how complicated is it? Thanks, Adam
-
Hello, is it possible to make a ios like drag menu, where I can "throw" the menu open? Maybe with throwProps plugin or so... I don't know, I am new to GSAP I mean something like you can see here: https://www.youtube.com/watch?v=hbuL-vUDBhg&feature=youtu.be&t=32s What I mean happens at 32s I've already tried it out as you can see in the codepen example. Greetings, luneyard
-
I cant for the life of me get a simple 3d rotation working in iOS Safari right now. It works from the Codepen for me, but not with all the same code in a simple html file (attached). This tells me I am probably doing something dumb. But basically it works correctly from desktop, but from my phone the rotated div disappears as it rotates. Please help. http://codepen.io/anon/pen/raYMwR index.html
-
Hi all, I'm having this problem with SVG rotation. Basically it always reset its position once the animation is finished. Codepen: http://codepen.io/anon/pen/QwwEYX During testing, it works fine on Chrome, but not of Firefox and mobile Safari. I'm using Firefox 33.1.1. Anyone's having the same issue? Any pointer is greatly appreciated. Cheers! UPDATE: Apparently the problem is exclusive to FF for mac and Safari mac.
-
Hello, I recently upgraded my AIR SDK to 15 and none of the UI made with the ThrowPropsPlugin seems to be working in the iOS "slow-test"/adhoc builds. TweenLite seems to be ok. Has anyone faced a similar issue? Also, I was using DataLoader to communicate with PHP which again is not working on the above build types. (It works on "fast-test" though.) Any idea what's happening here? Regards
-
Hi I am working on a website for a client which is basically an old flash site which I am translating into HTML with GSAP animation. The whole thing also uses parallax.js to create a layered 3d effect. This works great across all devices and moves when an ipad is tilted etc. My problem is that tweenmax is clashing somehow with the parallax javascript and causing the animations to jump or in the case of CSS opacity the fade does not work at all. When I remove parallax.js then it works just fine. So I did some research and then it occurred to me that it may be possible to create the parallax effect without using the plugin but through gsap itself and then it wouldn't cause compatibility issues. But although I can find examples of parallax controlled by mouse movement, there doesn't seem to be anything about creating this effect with device orientation/tilting etc Is this even possible? Thanks
-
Hi, I just updated my AIR SDK to version 14.0.0.125 and all my tweenmax scripts are not working anymore. Tweenlite works fine, and on Android it's ok. It's just Tweenmax on iOS (7 & 6). Anyone got the same problem ? kek
-
I have a crazy issue with "transformAroundPoint" my Code works perfect on iOS Xcode Simulator. But when I run the same thing on my iPad I get Errors! I never have seen any different behavior simulator vs. device. I hope anybody can help me... It also makes no difference if I don't do any scaling in transformAroundPoint always the same errors. S O U R C E C O D E >>>> ..... TweenPlugin.activate( [TransformAroundPointPlugin] ); Multitouch.inputMode = MultitouchInputMode.GESTURE; this.addEventListener( TransformGestureEvent.GESTURE_ZOOM, pointZoom ); } /** Zoom */ private function pointZoom( _event : TransformGestureEvent ) : void { trace("zoom"); var _transformPointX : Number = _event.stageX; var _transformPointY : Number = _event.stageY; /**/ var _scale : Number = _images[ _activeImage ].scaleX * _event.scaleX; var _myPoint : Point = new Point( _transformPointX, _transformPointY ); /**/ TweenLite.set( _images[ 3 ], { transformAroundPoint: { point: _myPoint, scale: _scale } } ); } <<<< E R R O R S O N I P A D >>>>> Exception fault: TypeError: Error #1006: value is not a function. at com.greensock::TweenLite/_init()[/Active/_Flash/_AS3_v12/src/com/greensock/TweenLite.as:559] at com.greensock::TweenLite/render()[/Active/_Flash/_AS3_v12/src/com/greensock/TweenLite.as:703] at com.greensock::TweenLite()[/Active/_Flash/_AS3_v12/src/com/greensock/TweenLite.as:488] at com.greensock::TweenLite$/set()[/Active/_Flash/_AS3_v12/src/com/greensock/TweenLite.as:1094] at com.ponyhof.gallery::GalleryZoomNew/pointZoom()[/Volumes/Work/Development/Projects/WordPress/src/com/ponyhof/gallery/GalleryZoomNew.as:431] at com.ponyhof.gallery::GalleryZoomNew/pointZoom()
-
Hi Guys, I have been strugling with getting Maxloader to load a png fil stored in my Ipads applicationStorageDirectory. I hope someone would be so kind and give som advice. Im working with Adobe Air 13.0, iOS 7. Thanx. Henrik Quick Code walk though: Loading the file: //LOADING THE FILE FROM WEBSERVER var loader:BinaryDataLoader = new BinaryDataLoader(filePathServer, {name:"downloadedfile.png", requireWithRoot:this.root, estimatedBytes:6800, onProgress:progressHandler, onComplete:completeHandler}); loader.load(); Saving the file: //SAVING THE FILE TO APPLICATION STORAGE DIRECTORY function completeHandler(event:LoaderEvent):void { var fileStream:FileStream = new FileStream(); var _dataD = LoaderMax.getContent(event.target.name); var _dFile = File.applicationStorageDirectory.resolvePath("includes/"+event.target.name); fileStream.open(_dFile, FileMode.WRITE); fileStream.writeBytes(_dataD, 0, _dataD.length); setTimeout(loadFileFromLocal, 2000); } // Re-Loading the file from Local storage Please note that when loading the file into a stageWebView it works fine! //RE LOADING THE FILE FROM LOCAL STORAGE function loadFileFromLocal():void { var file:String = "downloadedfile.png"; var pdf:File = File.applicationStorageDirectory.resolvePath("includes/"+file); //PHONE //LOADING IT INTO STAGEWEBVIEW WORKS !! var yOffset:Number = 40; var stageWebView:StageWebView = new StageWebView(); stageWebView.stage = stage; stageWebView.viewPort = new Rectangle(0, yOffset, 500, 500 - yOffset); stageWebView.loadURL(pdf.nativePath); //TRY TO LOAD VIA LOADERMAX - DOES NOT WORK ON IOS DEVICE, DOES WORK ON PC var myImage:ImageLoader = new ImageLoader(pdf.nativePath, {container:imgContainer, alpha:1,onProgress:progressHandlerRELOAD,onComplete:completeHandlerRELOAD}); myImage.load(); }
-
I am trying to delete on drag and drop or intersect with checkHitAreare it dorset seem to work with TransformManager. in my app i would like the user to be able to drag an item to a trashcan, the items are all objects that are in a TransformManager. is it possible to call same delete function that is used when desktop users hit the delete key? stage.addEventListener(Event.ENTER_FRAME, checkHitAreare); function checkHitAreare(evt:Event) { var currentMC:MovieClip; var removeMCs:Array = []; for(var i=0; i < stage.numChildren; i++){ currentMC = MovieClip(stage.getChildAt(i)); if (currentMC != this.recp_mc && this.recp_mc.hitTestObject(currentMC)) { removeMCs.push(currentMC); } } for(var j:int = 0 ; j < removeMCs.length;j++) { stage.removeChild(removeMCs[j]); } } -
I was wondering if a version newer than v11 (as3) is best suited for iOS / iPhone ?
-
Sorry if this has come up before. I did have a search, but wasn't sure how best to describe it. Anyway, I have a long HTML page which scrolls vertically. Nothing unusual about that... On this page, I have banners which are horizontally draggable, using Draggable. However, when I scroll vertically on iOS, if I drag within the Draggable banners, it stops the page scrolling. I want the Draggable banners to scroll horizontally, and the page to scroll vertically. How might I work around this? Is it even possible with iOS? Loving your work as always! Cheers, Steve
-
Hey so i'm not sure if this is a greensock bug or a browser bug or me just pushing the limits too much, but what i have noticed on a couple projects i've started lately is that where i may have a bunch of tweens going on successfully in Chrome or Firefox, that when i test in Safari or on my iPhone, the animations dont seem to fully update visually. if i resize the window or anything like that, the screen corrects itself. where i've run into it, the problem doen'st happen if only 1 or two things are tweening at once, but if a more than a handful are tweening at once, it seems that the browser cant keep up or something. if you zoom in or out or rotate the screen or something to get the browser to react, the end of the animation will rectify itself after its been messed up. even with the window resize listener turned off. you can check out one project currently in progress where you can view this. to see them problem, in safari or on iphone open the link, then click between "bird" and "big bang". you will see that the divs and the nav elements will linger in Safari and iOS, yet not in Firefox or Chrome. if you step across the nav one at a time, (big bang, liquid, snakes, globe, wedges, candle, bird...) then it tweens fine in all browsers. http://danehansen.com/temp/gs
-
Hi everyone, its been a few days since I found out and started using gsap js and must admit its an awesome framework. I make native games for iOS and now I evaluate gsap for html 5 cross platform 2d game development. I have a strange performance issue regarding the Draggable utility on iOS devices (maybe on other platforms too but I have not tested any other device). When the user moves the draggable element around with his finger I observe high CPU usage (55-65% on an iPhone 3GS) while when the user is not interracting with the element the CPU usage is 25-35%. I downloaded an updated version of Draggable from here but there was no difference. I am at your disposal for further info and testing!
-
I'm trying to use exportRoot(); in an iOS app. If the app is in the background for a length of time, the timeline can no longer resume. Is it possible that the timeline is lost in garbage collection? My pause screen is still visible and the buttons are still available. But nothing resumes. If you leave and come back quickly it's fine. Anything I can try to make it hold the timeline for as long as the app is in the background? --- EDIT ---- Sorry, looks like I was calling the exportRoot twice and that was the source of my trouble.
-
Hi guys, firstly, let me thank you for this fantastic animation platform. Discovering it was simply jaw-dropping experience that changed my life as a developer. I am now playing around with page that will have multiple animations triggered on particular scroll position. I decided to not use any parallax plugins that work on mobile, because they appeared to be slow. Basically, I want to animate some DOM elements when they come in to the view. I tested it in all browsers and it works fine, even on iOS, but sometimes it is acting a bit weird. I have problems only on iOS. I haven't tested any android, i don't have any. When you scroll slowly to the desired element, it animates just fine. But sometimes when you scroll faster, it appears in final position, but without an animation. Sometimes just part of an animation happens. I would like to understand whats going on there. Can you help me please, or at least point me to the right direction? I am using latest version of GSAP, tested on iPhone 4 with iOS 6.1.3 and iPad 3. I was able to recreate the issue on iOS simulator as well. I am attaching example code. Many thanks! scrolltest.zip
