Tooltip, der dem Cursor folgt
Ein kleines Label, das am Cursor klebt, ihm durch einen Bereich folgt und beim Hineinfahren aufpoppt.
Einstellungen
Code
<div class="uv-tf">Beweg die Maus hierher<span>Du bist hier</span></div>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Tooltips
Wofür du ihn nutzen kannst
Ein Tooltip, der der Maus folgt, passt zu allem, was man mit dem Zeiger erkundet: dem Grundriss eines Büros oder einer Location („Du bist hier“), einem Produktfoto, das zum Zoomen einlädt, einer interaktiven Karte oder der Fläche eines Diagramms. Das Label poppt auf, sobald der Cursor hineinfährt, und gleitet dann mit. Ein paar Zeilen JavaScript verfolgen die Position.
Ohne Maus ergibt er wenig Sinn, auf dem Handy erscheint er nur dort, wo der Finger tippt. Beschränk das Label auf zwei, drei Wörter. Ein langer Text, der dem Cursor hinterherjagt, nervt schnell.