Jump to content
GreenSock

Mukhriddin

In the Safari browser, when I hover over "Press and hold", for some reason I see a square.

Recommended Posts

Hi!
Press/Hold button works as expected on Chrome, but on Safari there exists a square for some reason. How could it be fixed. I'll appreciate your reply.

See the Pen utils by s (@s) on CodePen

Link to comment
Share on other sites

 

The minimal demo you wanted to add alongside your question does not seem to exist - it's showing a 404 error.

 

It's pretty tough to troubleshoot without a minimal demo - the issue could be caused by CSS, markup, a third party library, your browser, an external script that's totally unrelated to GSAP, etc. Would you please provide a very simple CodePen or CodeSandbox that demonstrates the issue? 

 

Please don't include your whole project. Just some colored <div> elements and the GSAP code is best (avoid frameworks if possible). See if you can recreate the issue with as few dependancies as possible. If not, incrementally add code bit by bit until it breaks. Usually people solve their own issues during this process! If not, then at least we have a reduced test case which greatly increases your chances of getting a relevant answer.

 

Here's a starter CodePen that loads all the plugins. Just click "fork" at the bottom right and make your minimal demo

See the Pen aYYOdN by GreenSock (@GreenSock) on CodePen

 

If you're using something like React/Next/Nuxt/Gatsby or some other framework, you may find CodeSandbox easier to use. 

 

Once we see an isolated demo, we'll do our best to jump in and help with your GSAP-specific questions. 

Link to comment
Share on other sites

8 minutes ago, GSAP Helper said:

 

The minimal demo you wanted to add alongside your question does not seem to exist - it's showing a 404 error.

 

It's pretty tough to troubleshoot without a minimal demo - the issue could be caused by CSS, markup, a third party library, your browser, an external script that's totally unrelated to GSAP, etc. Would you please provide a very simple CodePen or CodeSandbox that demonstrates the issue? 

 

Please don't include your whole project. Just some colored <div> elements and the GSAP code is best (avoid frameworks if possible). See if you can recreate the issue with as few dependancies as possible. If not, incrementally add code bit by bit until it breaks. Usually people solve their own issues during this process! If not, then at least we have a reduced test case which greatly increases your chances of getting a relevant answer.

 

Here's a starter CodePen that loads all the plugins. Just click "fork" at the bottom right and make your minimal demo

 

 

If you're using something like React/Next/Nuxt/Gatsby or some other framework, you may find CodeSandbox easier to use. 

 

Once we see an isolated demo, we'll do our best to jump in and help with your GSAP-specific questions. 

or sorry) it was codesandbox itself. https://codesandbox.io/s/press-hold-fgvpsw?file=/src/utils/cutomMouse.js.
I mistakenly put it on url input

Link to comment
Share on other sites

I've looked at it, but I can not find where the issue comes from. I think it is more of a CSS issue than a GSAP issue. I would try and recreate the button styling with less CSS attributes and narrow down what is causing the issue. Codepen.io is a good place for that, because there you can keep it simple and not include a whole React install. 

 

 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×