简体   繁体   中英

RShiny-CSS reactive message

I'm using Shiny for a while and recently started customize my app with CSS which is pretty cool. I managed to show a message box when the pointer goes over a particular element but now I would like to show a variable. For example in the following app when the mouse goes on the slider button, inside the message box I would like to compute the slider value ie "input$test" :

#### ui.R

shinyUI(fluidPage(
tags$head(tags$style(HTML('

                        .irs.js-irs-0.irs-with-grid .irs-slider.single:hover:after {
                        content: "SLIDER VALUE HERE";
                        background: #333;
                        background: rgba(0,0,0,.8);
                        border-radius: 5px;
                        bottom: 26px;
                        color: #fff;
                        left: 20%;
                        padding: 5px 15px;
                        position: absolute;
                        width: 220px;
                        text-align: center;
                        }

                        '))),

sliderInput("test", "TEST:", 
          min=0, max=1000, value=500)
))

#### server.R

library(shiny)
shinyServer(function(input, output) {
})

Thanks for your help.

Well this works, hope it will help someone else :

#### ui.R

shinyUI(fluidPage(


  uiOutput("htmltest"),

  sliderInput("test", "TEST:", 
          min=0, max=1000, value=500)

))

#### server.R

shinyServer(function(input, output) {


output$htmltest <- renderUI({
  txtx=paste('.irs.js-irs-0.irs-with-grid .irs-slider.single:hover:after {
                        content: "',input$test,'";
         background: #333;
         background: rgba(0,0,0,.8);
         border-radius: 5px;
         bottom: 26px;
         color: #fff;
         left: 20%;
         padding: 5px 15px;
         position: absolute;
         width: 220px;
         text-align: center;
}',sep="")

  tags$head(tags$style(HTML(txtx)))
})

})

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM