Javascript 在进度条中重写CSS

我试图理解为什么我的进度条（使用timer.js创建）中有灰色背景

我尝试过将背景颜色、背景样式更改为无或#FFFFFF，但灰色背景仍然存在

服务器.R

function(input, output, session) {
  mylevels <- reactive({
    Sys.sleep(100)
    input$num_levels
  })
  output$out <- renderText({
      return(paste0(mylevels()," is selected.."))
  })
}

var wasBusy=false；
var elapsedTimer=null；
var startTime=null；
函数updateBusy（）{
var isBusy=$（'html'）.hasClass（'shinny-busy'）；
如果（正忙&！正忙）{
startTime=新日期（）.getTime（）；
elapsedTimer=setInterval（函数（）{
var millisElapsed=new Date（）.getTime（）-startTime；
$（'.progress'）.text（Math.round（millisElapsed/1000）+“已过秒”）；
}, 1000);
}
如果（！isBusy&&wasBusy），则为else{
清除间隔（elapsedTimer）；
}
wasBusy=isBusy；
}

在

ui.r

中的

文本/css

样式标记中添加以下内容：

---

.progress{background:#FFFFFF；box shadow:none；}

一个正在工作的jsfiddle或codepen可能会有所帮助。由于缺少库或soI，您包含的这些代码有错误。我认为缺少的部分是您使用的timer.js（最底部的代码段）

！重要信息

在样式属性的末尾？我不明白。你这是什么意思！重要提示？

背景色：#FFFFFF！重要信息

。如果我能看到一个活的经验可以帮助你更多

library("shinythemes")
fluidPage(theme = shinytheme("spacelab"),

navbarPage("Test", id = "allResults",           
    tabPanel(value ='inputParam', title = 'User Actions',
        sidebarLayout(
          sidebarPanel(
            # Show Timer
            conditionalPanel("updateBusy() || $('html').hasClass('shiny-busy')",
                id='progressIndicator',
                "Calculation in progress ....\n",
                div(class='progress',includeHTML("timer.js"))
            ),

            tags$head(tags$style(type="text/css",
                '#progressIndicator {',
                '  position: fixed; bottom: 15px; right: 15px; width: 225px; height: 70px;',
                '  padding: 8px; border: 0.5px dotted #CCC; border-radius: 8px; ',
                '}'
            )),

            numericInput("num_levels", label = "", value = 3)
          ),
          mainPanel(
            textOutput('out')
          )
        )
    )
))