2014-12-11 5 views
11

반짝 이는 응용 프로그램에서 선택 드롭 다운의 높이를 변경하고 싶습니다. 기본 높이는 약 8 가지 옵션을 표시합니다. 더 자세히보고 싶습니다. 드롭 다운의 라인 높이를 줄임으로써 옵션의 수를 늘릴 수는 있지만, 그것은 나를위한 최적의 해결책은 아닙니다. 나는 그것을 수행하는 방법에 대해 많이 조사했고, selectize.js 코드를 살펴 보았다. 그리고 현재의 가설은 이것이 사소하거나 설계 상 불가능하다는 것이다.반짝이는 선택 드롭 다운의 높이를 변경하는 방법은 무엇입니까?

내가 배운 것은 select에서 표시되는 드롭 다운이 .selectize-dropdown-content 클래스의 div이지만 height 및 width 속성을 변경해도 아무 것도 변경되지 않는다는 것입니다. 그래도 배경 색상을 변경할 수 있습니다. 여기 내 하나의 파일 반짝 응용 프로그램 코드는 다음과 같습니다

server <- function(input, output) { 
    output$distPlot <- renderPlot({ 
     plot(0.5,0.5,xlim=c(0,1),ylim=c(0,1)) 
     text(0.5,0.5,input$Letter) 
    }) 
} 

ui <- shinyUI(fluidPage(
    sidebarLayout(
    sidebarPanel(
     selectizeInput("Letter", "", setNames(letters,letters),selected="a",multiple=FALSE),  
     tags$style(type='text/css', 
        ".selectize-dropdown-content { 
height: 600 px; 
width: 700 px; 
background-color: #b0c4de; 
}") 
    ), 
    mainPanel(plotOutput("distPlot")) 
) 
)) 

shinyApp(ui = ui, server = server) 

그래서 제 질문은 내가 selectize.js 가능하지 않는 올바른 요소의 CSS를 수정하고, 또는 드롭 높이의 변화 여부입니까?

답변

8

문제를 게시 한 후 몇 분 후에 해결책을 얻었습니다. 선택 드롭 다운의 높이는 max-height 속성에 의해 제어됩니다. 다음 CSS는 트릭을 수행합니다.

tags$style(type='text/css', ".selectize-dropdown-content {max-height: 400px; }"), 
+0

실수로 다운볼트를 사용하여 죄송합니다. 내가 되돌릴 수없는 것처럼 보입니다. –

+0

걱정 마세요 :)이 댓글을 더 길게 만듭니다. – mpiktas