Jump to content
Search Community

BennyBatta

Members
  • Posts

    5
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

BennyBatta's Achievements

  1. Ok, I've overcome the problen, and find a solution! GSAP has nothing to do with it, it has no compatibility defects, as someone suggested. The problem is due to a bug in Safari, that till a certain release (which one I don't know, by the way): the broiwser doesn't support the data format "yyyy-mm-dd". So I fixed with a simple regex replace, like this: dateString = dateString.replace(/-/g, '/') So, I apologize for bothering you unnecessarily (in fact, GSAP has no problems). I've included the solution in case anyone else encounters this error. Thanks again.
  2. Sorry, but I have only a 2014 iPad air 2 avaiable. The IOS version is 15.8.1. And there I can see the error. Good news knowing that on newer supports it works correctly. My problem with this iPad consists also in the fact that I don't know how to debug (I think is impossible directly on the iPad). For sure JS is working well, because some functions act correctly (but not all of them evidently). Anyway, I can consider that the error is limited only to some support, and is not generelized to the Mac system. I'm trying to learn more about this. Thanks for your answer, for now.
  3. Hi, Rodrigo. So, just to understand if you can see the problem or not: if you look in the home page (but also in the page called "Il progetto"), there's a section called "Le fasi complessive" where there are 3 data references, with the first colored in blue changing second by second in a moving countdown, while the other two are colored in orage signing the beginning of the next phases of the project. On PC the 3 data references work correctly. So if you can't find them looking on a Mac, it means that the problem is there. In the attached image you can see a live example, a screenshot taken on a PC 5 minutes ago.
  4. Well, I thought to setup a codepen, but in my opinion it shouldn't give the idea: I mean, it could be not useful to understand the problem, because on PC and on mobile it works great (the difference has evidence on the supports only). I haven't actually checked how it works and/or what happens on an Iphone, but for sure on Ipad the problem is present. Also it seems to be OK on a normal Mac, but I just made a fast check and I'd have to go deeper in this. Anyway, in this case a demo doesn't give any support to understand the problem. In theory I should have to try the debugging on a Mac, but I don't have it available. I was just hoping someone could help me. Regarding the code, I don't think it can depend on anything other than compatibility, because the code outside of GSAP is quite simple, and uses standard functions and operations.
  5. Hello. I'm new in the forum, and quite new to GSAP, too. Recently, I put in production a website. In the home page is included a countdown animated with GSAP. This is the link: http://www.progettoborgogni.it It works great on PC and on mobile, but I found problems with an ipad. I really can't find the problem. To solve, I tried to changed the libraries' relases with the newest I found, like this: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script> But I can't see any difference: the error is still there. The animation is quite simple, it is inside a JS function, with this method: animateFigure: function (elem, value) { let that = this, top = elem.querySelectorAll('.top')[0], bottom = elem.querySelectorAll('.bottom')[0], backTop = elem.querySelectorAll('.top-back')[0], backBottom = elem.querySelectorAll('.bottom-back')[0]; // Before we begin, change the back value backTop.querySelectorAll('span')[0].innerText = value; // Also change the back bottom value backBottom.querySelectorAll('span')[0].innerText = value; // Then animate gsap.to(top, 0.8, { rotationX: '-180deg', transformPerspective: 300, ease: Quart.easeOut, onComplete: function () { top.innerText = value; bottom.innerText = value; gsap.set(top, { rotationX: 0 }); }, }); gsap.to(backTop, 0.8, { rotationX: 0, transformPerspective: 300, ease: Quart.easeOut, clearProps: 'all', }); }, Is there someone who's able to explain me what's going on? Thanks in advance.
×
×
  • Create New...