Tooltip is squished when in horizontally scrolling page

オープン

#298 2022年2月11日に作成コメント 0 件リアクション 3 件担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度: 3/5
見積もり時間: 1〜2日
初心者へのやさしさ: 45/100

issue の種類: バグ
明瞭さ: おおむね明確
活発さ: 停滞
技術スタック: react, typescript
領域: frontend

調査の方向性

http://react-component.github.io/tooltip/examples/placement.html の placement 例から始め、.example に margin-left: 110vw を追加して問題を再現し、その後ブラウザーで tooltip の配置動作を調べます。コンテンツが右側へスクロールして画面外に出た後も、長い tooltip が意図した幅を維持すれば作業は完了です。

索引モデルが issue の本文から書いたものです。

説明

In our application we have a very long horizontally scrolling page (week scheduler). Any tooltips that appear after scrolling to the right are squished. Replication:

Go go the example http://react-component.github.io/tooltip/examples/placement.html

In your browser's debugging tools change one of the tooltips to be longer so the squishing is more obvious.

Add this CSS

.example {
    margin-left: 110vw;
}

You can see that once the content is off the screen to the right the tooltip is only as wide as the longest word.

主要言語: TypeScript
スター: 944
フォーク: 199
平均マージ: 19時間 1分
マージ済み PR（30日）: 3

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

はじめの一歩

issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
リポジトリをフォークし、ブランチを切って変更します。
issue 番号を参照したプルリクエストを送ります。

react-component/tooltip のほかの issue

Tooltip cannot be closed with `Escape` key オープン

難易度 3/5 1〜2日初心者へのやさしさ 64/100

react-component/tooltip#510 · コメント 1 件 · 2026年3月25日に作成
rc-tooltip@6.4.0 arrow style bug オープン

難易度 3/5 1〜2日初心者へのやさしさ 35/100

react-component/tooltip#499 · コメント 1 件 · リアクション 1 件 · 2025年9月8日に作成
Warning: findDOMNode is deprecated and will be removed in the next major release. Instead, add a ref directly to the element you want to reference オープン

難易度 3/5 1〜2日初心者へのやさしさ 35/100

react-component/tooltip#488 · コメント 4 件 · リアクション 2 件 · 2024年12月18日に作成
Is the arrowContent prop deprecated? オープン

難易度 2/5 1〜3時間初心者へのやさしさ 35/100

react-component/tooltip#487 · 2024年12月12日に作成
chrome 128 版本开始，如果 css 的 zoom 样式不为 1，则 tooltip 的展现位置不对。オープン

難易度 3/5 1〜2日初心者へのやさしさ 35/100

react-component/tooltip#483 · 2024年9月19日に作成

react-component/tooltip の issue をすべて見る

似ている issue

Ajv defaults: non-standard "format": "json" in third-party schemas (e.g. Notion) warns twice per property — register it like #2601 オープン

難易度 2/5 1〜3時間初心者へのやさしさ 70/100

modelcontextprotocol/typescript-sdk#2854 · 2026年9月24日に作成
[Bug]: ctx_search rejects singular 'query' param despite schema declaring it valid オープン

難易度 2/5 1〜3時間初心者へのやさしさ 75/100

mksglu/context-mode#1200 · 2026年9月24日に作成
[chore]: test(search): Migrate ResultItemTitle unit tests to TypeScript オープン

難易度 2/5 1〜3時間初心者へのやさしさ 75/100

jaegertracing/jaeger-ui#4506 · 2026年9月24日に作成
[BUG] "$250 credit for cloud sessions" gift icon is unclickable オープン

area:desktop area:ui bug platform:macos

難易度 2/5 1〜3時間初心者へのやさしさ 75/100

anthropics/claude-code#96687 · 2026年9月24日に作成
[GOOD FIRST ISSUE]: Clean Up Frontend Authentication Page & Context オープン

good first issue

難易度 1/5 1時間未満初心者へのやさしさ 95/100

AOSSIE-Org/DebateAI#582 · コメント 2 件 · 2026年9月24日に作成

TypeScript の issue をもっと見る