Jump to content
GreenSock

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

Search the Community

Showing results for tags 'ios'.



More search options

  • 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
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

Found 43 results

  1. Hi! First of all - thanks for the wonderfull ScrollTrigger plugin! It's amazing! Now to my issue: When I try to snap on iOS I get some very laggy scrolling - just like back then with this issue: So now I wanted to know if there is a possibility to pass the autoKill attribute to the snapping. I tried to simply use it but wasn't that lucky I'm building something like this: https://codepen.io/team/pixelart/pen/mdVbobo In this codepen it seems to work, but not in my project (I can't see a difference). First I thought it is caused by the scroll-behavior: smooth, but it still happens after I set it back to auto. Any idea what could cause the lag or how to fix this? Thanks, janein
  2. Hello. thank you for your work. I'm using GSAP with React and ScrollMagic and having troubles with IOS scroll animations. other platforms have great productivity of animations. What am I doing wrong?
  3. leydar

    Janky SVG on iOS

    I'm loading an SVG I created in Inkscape and using it as a control in an Ionic hybrid app with help from GSAP. When a user clicks on the L/R it spins about and disappears to reveal other options. Using it in the browser and on Android works great. On iOS however it's occasionally spotty. This mostly occurs after a reboot. Subsequent interactions are at the desired speed. This might be difficult to reproduce as it's possibly specific to the device I'm using. Having said that, I'm open to completely redesigning how the thing disappears. I just need it to hide and show itself in some aesthetically pleasing manner. Incidentally, I tried using autoAlpha: 0 and it didn't change the opacity or hide the elements. I've isolated the control in an otherwise blank project to better illustrate the issue (github). The video attached shows the control running on an iPhone SE, iOS 11.4, 64-bit A9 SoC processor (two 1.8GHz cores), 2GB RAM, PowerVR GT7600 (six-core graphics). addEventHandlers () { const yingyang: any = document.getElementById("select-side"); yingyang.addEventListener("load", function() { const content = yingyang.contentDocument; const ying = content.getElementById("ying"); ying.addEventListener('click', function() { TweenMax.to(ying, 0.4, { scale: 2, x: "+100%", y: "-50%", transformOrigin:"100% 0%", opacity: 0, force3D:false, autoRound: false }); this.animateSelectSide(yingyang); }.bind(this)); }.bind(this)); }; animateSelectSide(yingyang: HTMLElement) { TweenMax.to(yingyang, 0.7, { rotation: -270, opacity: 0, force3D:false, autoRound: false, onComplete: function() { yingyang.style.left = '-500px'; } }); }; speedkills.MP4 yingyang.svg
  4. Hey guys, This is not strictly related to the greensock, but also could be I created a banner which has video inside and the video is muted. Whenever my banner is showed, no matter if inside app or inside browser, on IOS, any other sound in background (such as music player) will stop. I know this is default behavior of the IOS (and android as well), but I also saw that some company managed to build banner with video which doesn`t stop background music, but I`m still not sure how. So my questions is - is it possible to workaround somehow this issue inside banner itself via javascript or something ? Maybe something like playing video through the canvas (already tried that didn`t worked), or separating video and audio, dunno. Is there hack or a way to play video that will not affect background music on IOS ? ! Thanks
  5. Note that I am working on other's implementation, I am not familiar with GSAP yet. In this animation, when the safe opens... red boxes are coming out of it. There is a performance issue with these flying boxes. They don't "fly" smoothly only on ios devices (all of them). This is happening at line 168 in logosDistances.forEach loop. For the debugging, to ensure that there is no other animation in progress at the same time... I wrapped this tween in a timeout of 3sec. There is TinyURL for this animation, the: https://tinyurl.com/redredbox Thank you in advance
  6. Hi all, I'm attempting to create a vertical draggable with for a "fashionable" effect, an everything works as expected on Android, but not on iOS. On Android, the page doesn't scroll when I swipe up on the draggable, and scrolls only when I tap outside of it. On iOS, bot IPhone and iPad, looks like the page has a priority on the draggable (or the swipe event "bubbles" from the draggable), thus the draggable stays almost in the same position, and the page scrolls. In this pen, the gray draggable scrolls into the black box, and overflows it for a maximum of half of the draggable height. How can I get the same behavior on the platforms? Thanks in advance! (It's better to test the pen in full page mode: https://codepen.io/massic80/full/qYbpOL)
  7. Hi, I'm having real issues with a draggable map I've created, specifically on devices using iOS. My animations all run nicely, however when I press and try to drag the map around, there's a good 4-5 seconds before the page responds, and then the move happens instantly, rather than smoothly. If necessary I can provide you with a link to view the development site if that helps, however, I'll need to send it privately if possible? There are a number of layers creating the map, all stacked on top of each other - might this have something to do with it? Any help you're able to give me would be greatly appreciated. Kind regards
  8. Hello all, I just had a problem with iOS 10 Safari and the ScrollToPlugin, there are some changed that now will trigger the autoKill function. It has taken me more than a hour to realize that it was the autoKill function who stopped the animation. (iOS9 Safari didnt had this problem) Just for people with the same problem (I think almost everybody who is using ScrollToPlugin) for now just add "autoKill:false": TweenLite.to(window, 1, {scrollTo: {y:2000, autoKill:false}, ease:Power2.easeInOut}); Sorry for no Codepen but you can easily try it out with the Safari Developers Debug, just open a page that is using GSAP on your iPhone en run code without autoKill:false. (Sometimes it will not autoKill it, but almost always). Hope that I have made someone happy with the same problem Greets! Vincent
  9. TLDR: In iOS 11, if using scrollTo plugin for the window while an input is focused, it thinks the bottom of the mobile keyboard is the bottom of the viewport rather than the top of the keyboard, thus hiding any inputs located at the very bottom of a page. Any Greensock fixes? I discovered this error due to iOS's 3rd-party keyboards not accounting for the input selector bar on top of the mobile keyboard when determining the bottom of the viewport while an input is focused located at the bottom of the window, thus blocking the view of the input. What seems to be happening is if the window element is moved using scrollTo while an input is focused at the very bottom of the window, the correct positioning is not scrolled to. This is the case mainly for values that exceed the height of the window, and subsequently effects using the scrollTo Plugin when using scrollTo:"max" I know you all can't fix the iOS issue, but since its affecting the plugin, is there any workaround to account for when an input is selected such as a chat entry box at the bottom of the screen, and have the plugin scroll to the bottom of the screen properly? I've included a codepen, but only works in debug mode since there was already an issue you all found with scrolling in iOS in iframes. Thanks! https://s.codepen.io/tallwhitey/debug/gozWWQ/VGrWNnabZVaM
  10. I noticed that very specific to Apple iOS mobile devices using the Safari browser on mobile, using the animation effect marginRight for background elements having a background-image with repeat-x seemed to have a stuttering effect. When viewed in desktop browsers and browsers other than Safari, the stuttering effect on the background repeated element is not seen. Is it because of one of the CSS effects I applied, which is the width != 100%, or is it the way GSAP JavaScript code is written? Please kindly view the Codepen attached. All good helpful feedback appreciated!
  11. Hello I am new to both adobe animate cc (2017) and GSAP and would appreciate a dumb down answer to this question. So I've followed the tutorial of opening an action, opening a url of the zip file that you download from Greensock. It works when working in html5 canvas for adobe animate cc. However when working in IOS air canvas, I can't find how to upload the zip file. Does anyone know if GSAP works with IOS air and how?
  12. Hi guys! I'm having a bit of trouble here with Draggable util. I am trying to make a tabbed interface on mobile, made of a horizontal container which can be scrolled in the X axis with sections, and sections which can have any number of posts, and can scroll in the Y axis. With draggable, this works great in desktop when using a mouse, but when on mobile (Android, iOS, or Chrome Inspector as mobile), the X axis won't budge. You can watch it in action in the codepen. Any insight on it would be greatly appreciated
  13. I've got an very simple animation where an element is positioned relatively @ top:820px; with a style sheet (so not inline). I use a Tween.from() to tween the element from 1080px; This animation works fine on Web and in Electron but when I execute it on an iPad in safari, the element ends up at position 418px. I'm a bit at a loss of what could be wrong so any advice would be appreciated. I've added a codepen example. The top of the grey box should animate up to match the black line but on iOS it actually will animate to a different position.
  14. Please Remove the Topic. Issue relays on latest TimeLineLite (1.19.1). Issue is not reproducable on version 1.17 or older. So we are back to version 1.17 Thank you, ThemePunch
  15. I forked this off of codepen. http://codepen.io/magalhaespaulo/pen/OyQeQv But mine does not render correctly on iOS. The road and clouds rotate correctly, but the city is way off on iOS. I am trying to get it to work so I can use it on a banner ad.
  16. 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!
  17. 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
  18. 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
  19. 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
  20. 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
  21. 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!
  22. 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
  23. 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).
  24. 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
  25. 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
×