ShinyプログレスバーのCSSを無効にする

Question

進捗バーに灰色の背景（timer.jsを使用して作成されたもの）がある理由を理解しようとしています。

background-color、background-styleをnoneまたは#FFFFFFに変更しようとしましたが、灰色の背景がまだ残っています。

server.R

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

ui.R：

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') 
     ) 
     ) 
    ) 
)) 

<script type="text/javascript"> 
 
var wasBusy = false; 
 
var elapsedTimer = null; 
 
var startTime = null; 
 
function updateBusy() { 
 
    var isBusy = $('html').hasClass('shiny-busy'); 
 
    if (isBusy && !wasBusy) { 
 
    startTime = new Date().getTime(); 
 
    elapsedTimer = setInterval(function() { 
 
     var millisElapsed = new Date().getTime() - startTime; 
 
     $('.progress').text(Math.round(millisElapsed/1000) + ' seconds have elapsed'); 
 
    }, 1000); 
 
    } 
 
    else if (!isBusy && wasBusy) { 
 
    clearInterval(elapsedTimer); 
 
    } 
 
    wasBusy = isBusy; 
 
} 
 
</script>

Answer 1

トンを追加します。彼はui.rであなたのtext/cssスタイルタグに次

.progress {background:#FFFFFF; box-shadow:none;}