Questions tagged [tooltip]

Tooltips are a GUI (Graphical User Interface) element which typically pops up when the mouse pointer is hovering over an item in the GUI and provides some contextual information or clarification.

A tooltip is a small message, helping to understand the underlying content, often a button, a selection or link. It often appears after a certain amount of time, usually a few seconds, or while hovering over a certain area, and vanishes easily in order to not disturb too much.

Some visual examples of tooltips:

enter image description here

enter image description here enter image description here enter image description here

This video presents various flavors of tooltips.

7186 questions
2
votes
0 answers

Bootstrap 4.3.1 Tooltip not working in Angular 8

After upgrading to Angular 8 bootstrap tooltip not working working. It was working fine in Angular 7. Bootstrap v4.3.1, jQuery v3.4.1 .html
Sinju Angajan
  • 833
  • 2
  • 10
  • 20
2
votes
1 answer

How to make a BootstrapVue tooltip fade away after 2 seconds?

I created a button that when clicked, copies some text and shows me a tooltip, acknowledging that the text was copied. I want to make the tooltip fade away after 2 seconds. I tried to use a timeOut() method to fade away the tooltip, but it doesn't…
Manuel Abascal
  • 5,616
  • 5
  • 35
  • 68
2
votes
1 answer

FullCalendar returns "Failure Parsing JSON" when trying to add tooltip

To Fix the issue of parsing, I had to add tooltip.js and popper.js (my stupid head forgot to do so) My problem now is that it's rendering the events but the tooltip still doesn`t render on hover or click. I am currently trying to get hover…
2
votes
1 answer

Why doesn't the style of the bootstrap tooltip show?

I am trying to style text in a bootstrap tooltip. My request is rather simple: I want the tooltip text on the first button to appear in red. I use the data-html="true" to use HTML in my tooltip. Why isn't it red?
2
votes
1 answer

Bootstrap CSS breaks tooltip popover

The event tooltip event render works fine until i add a bootstrap css Working site https://fullcalendar.io/docs/event-tooltip-demo When i add the following to the css https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css It…
2
votes
3 answers

Why is my AmChart XYChart only showing a single tooltip for multiple series?

I'm using AmCharts v4 to create an XYChart with 3 series. When each series is created, I assign a tooltip: series.tooltipText = "{name}: [bold]{valueY}[/]"; However, the chart ends up displaying only a single tooltip (Temperature: -50). There are…
afarley
  • 781
  • 6
  • 26
2
votes
2 answers

Chart.js version 2.5 tooltip align items horizontally

I am working on chart.js version 2.5 Currently values are displaying vertical, i want to display horizontally. Some of the advance charts has 20 values. Please check the below attached image. Intended results: White or Caucasian and Black or…
Manjunath Siddappa
  • 2,126
  • 2
  • 21
  • 40
2
votes
2 answers

Is it possible to load tooltip with external data with React-Native-HighCharts?

Good Morning, Is it possible to read an external variable containing a list within the settings of a HighCharts chart for React-Native? I'm using the component: "react-native-highcharts". My code: import ChartView from…
2
votes
5 answers

Tooltip message text and background color

I have Image.asset wrapped on Tooltip Padding( padding: edgeInsets, child: Tooltip(preferBelow: false, message: "Miejsca parkingowe ogólnodostępne", child: Image.asset("assets/icons/garage.png", width: _iconSize, height:…
Maciek
  • 161
  • 3
  • 11
2
votes
2 answers

How to add tooltips or overlay text in a Matlab figure

I have a figure with two or more lines. These lines have additional, important information associated with them, like how many data points were averaged to create the line etc. I would like to access this information in my figure. I thought a good…
user2305193
  • 2,079
  • 18
  • 39
2
votes
2 answers

Using Angular Material ToolTip but can't select text on element beneath it

I have an Angular Material tooltip used to display information when hovering over a columns cells in a table element. On top of this functionality I also require users to be able to select the text and highlight it from the table element so they can…
Benny
  • 155
  • 3
  • 15
2
votes
2 answers

How to hide a matTooltip after set time interval?

I have looked at Angular official material design tooltip page, however, cannot seem to find anywhere how to hide a matTooltip after set time interval if a user stays on the object for a long period of time? Is there a separate in-built property for…
Mickonis
  • 25
  • 1
  • 3
2
votes
2 answers

CSS is not applied to Custom Tooltips's arrow

I am using ReactTooltip Example Component {children} SCSS .customTheme { color: #ff6e00 !important; background-color: orange…
Kuldeep Bhimte
  • 961
  • 1
  • 10
  • 25
2
votes
2 answers

Bootstrap tooltip doesn't work on dynamically generated elements

Code for generating element dynamically: var rStatus = $("#statusText").val(); var roleID = $('#' + Globals.divUserRoleID).html().trim(); var nodelen = response.tsuites.length; $("#TestSuiteSideMenu").empty(); for(var…
Rovin Patwal
  • 109
  • 1
  • 13
2
votes
1 answer

jQuery Tooltip Showing Tabs But Not Newlines?

I'm using the following jQuery code to display tooltips in a .NET web application: $(document).ready(function () { // Tooltip only Text $('.masterTooltip').hover(function () { // Hover over code var title = $(this).attr('title'); …
Tony Trozzo
  • 1,231
  • 6
  • 20
  • 34
1 2 3
99
100