navebarMenu始终突出显示

Question

我有一个navbarPage，其中有三个navbarMenu。但是第一个navbarMenu，即＆＃34;帮助＆＃34;默认情况下始终突出显示navbarMenu tabpanel＆＃34;手册＆＃34;也总是突出显示。如何避免这种情况。示例代码如下所示

ui.r

shinyUI(fluidPage(theme = "bootstrap.css",
                  (navbarPage("B Version",
                              position = c("fixed-top"),
                              fluid=TRUE,
                              navbarMenu("Help",
                                         tabPanel(
                                           a("Manual",
                                             target="_blank", href="Manual.pdf")
                                         ),
                                         tabPanel(
                                           a("Supporte",
                                             target="_blank", href="gpl.pdf")
                                         ),
                                         tabPanel(
                                           a("Tutorials",
                                             downloadLink("AbE", "Expression", class=" fa fa-cloud-download"),
                                             downloadLink("DiEx", "Expression", class=" fa fa-cloud-download")
                                           )
                                         )
                              ),
                              navbarMenu("Sample Data",
                                         tabPanel(
                                           downloadLink("AData", " Aff", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           downloadLink("CData", " Code", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           downloadLink("IData", " Il", class=" fa fa-cloud-download")
                                         )
                              ),
                              navbarMenu("Stand-Alone Version",
                                         tabPanel(
                                           downloadLink("CodeandData", " app", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           a("Stand-alone Manual",
                                             target = "_blank", href= "Stand-alone.pdf")
                                         )
                              )

                  )
                  )
)
)

server.r

shinyServer(function(input, output,session) {
})

----------------------------------------------- --------------------

*修改

这部分展示了它对@amrrs 提供的答案的反应。它会在按下光标时显示数据，然后再次消失。

ui.r

shinyUI(fluidPage(theme = "bootstrap.css",
                  tags$script("setInterval(function(){
                              $('.active').removeClass('active');//remove class active
                              },1000);"),
                  (navbarPage("B Version",
                              position = c("fixed-top"),
                              fluid=TRUE,selected = "none",
                              navbarMenu("Help", 
                                         tabPanel(
                                           a("Manual",
                                             target="_blank", href="Manual.pdf")
                                         ),
                                         tabPanel(
                                           a("Supporte",
                                             target="_blank", href="gpl.pdf")
                                         ),
                                         tabPanel(
                                           a("Tutorials",
                                             downloadLink("AbE", "Expression", class=" fa fa-cloud-download"),
                                             downloadLink("DiEx", "Expression", class=" fa fa-cloud-download")
                                           )
                                         )
                              ),
                              navbarMenu("Sample Data",
                                         tabPanel(
                                           downloadLink("AData", " Aff", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           downloadLink("CData", " Code", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           downloadLink("IData", " Il", class=" fa fa-cloud-download")
                                         )
                              ),
                              navbarMenu("Stand-Alone Version",
                                         tabPanel(
                                           downloadLink("CodeandData", " app", class=" fa fa-cloud-download")
                                         ),
                                         tabPanel(
                                           a("Stand-alone Manual",
                                             target = "_blank", href= "Stand-alone.pdf")
                                         )
                              )


)
),

br(),
br(),



sidebarLayout(
  sidebarPanel(
    h5("Upload Data Files",style="bold"),
    fileInput("files", 
              "Choose CSV/txt processed files or raw files",
              multiple = "TRUE",
              accept=c('text/csv',
                       'text/comma-separated-values,
                       text/plain', '.csv','.cel','.TXT','.txt'))

                      ),

                    mainPanel(
                      tabsetPanel(id = "MaTabs",
                        tabPanel("Source-data", dataTableOutput("sourced"))
                      )

                    )
                    )))

server.r

shinyServer(function(input, output,session) {

  output$sourced <- renderDataTable(mtcars)
})

Answer 1

根据此answer添加一小段js帮助它。

更新了代码，隐藏只有nav的活动：

2 5 7 10 12 15 17 20 22 25 27 30 32 35 37 40 42 45 47 50 52 55 57 60 62 65 67 70 72 75 77 80 82 85 87 90 92 95 97 100 

Answer 2

要从第一个navbarMenu中删除突出显示，您可以在selected = "none"函数中添加参数navbarPage。要从navbarMenu tabpanel中删除突出显示，您可以使用以下css：

tags$style(type = 'text/css', ".navbar-default .navbar-nav .open .dropdown-menu .active a{color : #333; background-color:#f5f5f5;}")

所以在你的代码中它会是这样的：

shinyUI(fluidPage(theme = "bootstrap.css",
                             tags$style(type = 'text/css', ".navbar-default .navbar-nav .open .dropdown-menu .active a{color : #333; background-color:#f5f5f5;}"),

                            (navbarPage("B Version",
                                        position = c("fixed-top"),
                                        fluid=TRUE,selected = "none",
                                        navbarMenu("Help", 
                                                   tabPanel(
                                                     a("Manual",
                                                       target="_blank", href="Manual.pdf")
                                                   ),
                                                   tabPanel(
                                                     a("Supporte",
                                                       target="_blank", href="gpl.pdf")
                                                   ),
                                                   tabPanel(
                                                     a("Tutorials",
                                                       downloadLink("AbE", "Expression", class=" fa fa-cloud-download"),
                                                       downloadLink("DiEx", "Expression", class=" fa fa-cloud-download")
                                                     )
                                                   )
                                        ),
                                        navbarMenu("Sample Data",
                                                   tabPanel(
                                                     downloadLink("AData", " Aff", class=" fa fa-cloud-download")
                                                   ),
                                                   tabPanel(
                                                     downloadLink("CData", " Code", class=" fa fa-cloud-download")
                                                   ),
                                                   tabPanel(
                                                     downloadLink("IData", " Il", class=" fa fa-cloud-download")
                                                   )
                                        ),
                                        navbarMenu("Stand-Alone Version",
                                                   tabPanel(
                                                     downloadLink("CodeandData", " app", class=" fa fa-cloud-download")
                                                   ),
                                                   tabPanel(
                                                     a("Stand-alone Manual",
                                                       target = "_blank", href= "Stand-alone.pdf")
                                                   )
                                        )

                            )
                            )
    )
    )

通过这个，您可以得到输出：

和