I have an absolute Panel in my R shiny app and I am attempting to adjust its opacity based on the mouseover action. The goal is to have the opacity at 1 when the cursor is on the panel, and 0.5 otherwise.
However, the code I tried ended up making the panel transparent regardless of the mouseover action.
fluidPage(
tags$head(tags$style(
HTML('
#input_date_control {opacity : 0.65;}
#sel_date {opacity: 1;}')
)),
absolutePanel(id = "input_date_control", class = "panel panel-default", fixed = TRUE,
draggable = TRUE, top = 60, left = "auto", right = 20, bottom = "auto",
width = 230, height = 213,
box(title = 'Selector', width = 11.5, status = 'primary', solidHeader = TRUE,
tags$head(
tags$style(
".selectize-dropdown, .selectize-input, .selectize-input {
line-height: 10px;
}"
)
),
selectizeInput("disease", label = "Select disease('s)",
choices = unique(salmonella_all$Disease), multiple = T,
options = list(maxItems = 12, placeholder = 'Select a disease'),
selected = "Chlamydia"),
dateRangeInput("daterange", "Select date range:",
start = "2014-01-07",
end = "2017-10-15",
min = "2014-01-07",
max = "2017-10-15"
)
))
)See the output of the code here.
The desired outcome is for the panel to be transparent when there is no mouseover, and opaque only when the cursor is over the panel.