Hoppa till innehållet
ÖVERLÄGG · FREE

Tooltip

Ett kort tips vid hovring eller fokus, utan skript.

Ett kort tips vid hovring och vid tangentbordsfokus. Det är ren CSS, så det fungerar redan innan sidan blir interaktiv.

Varför det hjälper

  • Hovring och fokus
  • Inget skript behövs
  • Tillgänglig

Var det passar

  • Ikonknappar
  • Förkortningar
  • Ikoner i spåret
Kontrollen Tooltip på en RayCraft-sida

Exempel

<Stack Spacing="8" Wrap Style="padding:2rem">
    <Tooltip Text="Top (default)"><Button Variant="Variant.Outlined">Top</Button></Tooltip>
    <Tooltip Text="Bottom" Placement="TooltipPlacement.Bottom"><Button Variant="Variant.Outlined">Bottom</Button></Tooltip>
    <Tooltip Text="Left" Placement="TooltipPlacement.Left"><Button Variant="Variant.Outlined">Left</Button></Tooltip>
    <Tooltip Text="Right" Placement="TooltipPlacement.Right"><Button Variant="Variant.Outlined">Right</Button></Tooltip>
</Stack>

Ett kort utdrag. Lägg till @using RayCraft.Blazor.Components på din sida och använd ett interaktivt renderingsläge.

Ingår i RayCraft Free. Fungerande exempel finns i GitHub-arkiv (MIT); det innehåller exempel- och demokod, inte bibliotekets kod.

Alla kontroller ยท Dokumentation