GithubHelp home page GithubHelp logo

Comments (4)

GaryGen avatar GaryGen commented on July 21, 2024 1

Thank you for the reply. The new delay is a big improvement.

The behavior still seems very different from something like Google Chrome Bookmark Bar (Mac or Windows). The biggest difference is that the tooltips in Chrome only persist if the mouse is over the target. In Google CoLab, the tooltip persist when the mouse is over the target OR the tooltip. Also, in terms of the delay, the initial delay for a bookmark bar tooltip in Chrome is multiple seconds. However, once engaged, the tooltips for each item appear almost immediately.

The persistent tooltip leads to the problem I ran into with the "+ Code" button and the "Play" button directly under it, if the tooltip does get triggered, the "+ Code" button is obscured until the mouse is removed from the area. As noted previously, this also occurs with the "Rename notebook" tooltip covering the menu.

Video of this behavior attached.

CoLabTooltip.mp4

from colabtools.

zelliott avatar zelliott commented on July 21, 2024

Thanks for the feedback @GaryGen. We just pushed a change to Colab's tooltips that makes it so a tooltip doesn't appear unless you're hovering on its host element for at least 500ms, roughly following the guidance at https://www.nngroup.com/articles/timing-exposing-content/. We also reduced the amount of time that needs to pass before a tooltip disappears. If you havenโ€™t done so already, try refreshing your browser to catch these most recent changes.

Does this address your feedback? If not, screenshots, repro notebooks, and/or video will be really helpful to identify how we can further improve things!

from colabtools.

zelliott avatar zelliott commented on July 21, 2024

Thanks for the helpful reply @GaryGen, glad we're moving in the right direction! :)

In Google CoLab, the tooltip persist when the mouse is over the target OR the tooltip.

You're right - this was actually a recent change to satisfy https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus. From that link:

If pointer hover can trigger the additional content, then the pointer can be moved over the additional content without the additional content disappearing;

So unfortunately we likely can't change that behavior, otherwise we'd fail that success criteria. But maybe we can further improve things some other way.

Also, in terms of the delay, the initial delay for a bookmark bar tooltip in Chrome is multiple seconds. However, once engaged, the tooltips for each item appear almost immediately.

The persistent tooltip leads to the problem I ran into with the "+ Code" button and the "Play" button directly under it, if the tooltip does get triggered, the "+ Code" button is obscured until the mouse is removed from the area. As noted previously, this also occurs with the "Rename notebook" tooltip covering the menu.

Lots of ideas for us to explore here, including:

  • Mimic Chrome's bookmark bar tooltip delay behavior (thanks for sharing!)
  • Re-position these particular tooltips to either the left/right/top of the target so as to cover less important content
  • Further increase the show delay
  • Further decrease the hide delay
  • Remove these particular tooltips (perhaps they simply don't carry enough value)
  • Provide a user setting to turn off all tooltips (as suggested earlier in this thread)

For now, I filed a ticket on our side to track this investigation internally (b/347921812). One final tip that may improve things for you in the interim, you can press ESC to dismiss any tooltip on the page, even if you're hovered over the target or the tooltip. I've found that this is sometimes a faster way to dismiss pesky tooltips.

from colabtools.

GaryGen avatar GaryGen commented on July 21, 2024

Thanks for the reply and the consideration.
I'm not sure what's driving the standard you're referring to or your interpretation of it applying to tooltips, but you clearly have a specific requirement set in mind.
Thanks again.

from colabtools.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.