Display Text only on hover

Question

I'm working on a shiny app in which I only want to want textouput on hover or mouse over action

I tried adding an action button

UI:

fluidRow(box (title = p("Rates by Gender and Race", actionButton("titleBtId", "", icon=icon('question-circle'),class = "btn-xs", title = "Info"),textOutput("text_id"),hover=T), width = 15, status = 'primary', solidHeader = TRUE,tabPanel('',plotlyOutput("racegender",height = "100%"))%>% withSpinner(color="#0dc5c1")))

Server:

output$text_id <- renderText({
  paste0("hi")
})

I'm not sure how would I edit it to only display text on hover

Answer 1

Got it working using ModalDialog

UI

fluidRow(
box (title = p("Rates by Gender and Race",  tags$head(                                     tags$style(HTML('#titleBtId{background-color:black}'))), actionButton("titleBtId", "", icon=icon('question-circle'),class = "btn-xs", title = "Info"),hover=T), width = 15, status = 'primary', solidHeader = TRUE,                                     tabPanel('',plotlyOutput("racegender",height = "100%"))%>% withSpinner(color="#0dc5c1")))

Server:

  observeEvent(input$titleBtId, {
    showModal(modalDialog(
      title = "Note",
      "This chart if independent of Date-range and Age-range selections",
      easyClose = TRUE
    ))
  })

Answer 2

An alternative to modal popups, depending on what user experience you want, is to use tooltips from the shinyBS package, which has functions for subtle but effective popups and tooltips. Here is an example of the different functionality of hovering or clicking, and putting the tooltips in the UI or in the server, with equivalent experience. Note that theoretically you could put a hover tooltip in the UI using tipify() , but for some reason this doesn't seem to be working with actionButtons though it continues to work for other input elements.

library(shiny)
library(shinyBS)

ui <- fluidPage(
   titlePanel("ShinyBS tooltips"),
   actionButton("btn", "On hover"),
   tipify(actionButton("btn2", "On click"), "Hello again! This is a click-able pop-up", placement="bottom", trigger = "click")
  )

server <- function(input, output, session) {
  addTooltip(session=session,id="btn",title="Hello! This is a hover pop-up. You'll have to click to see the next one.")
}

shinyApp(ui, server)