2016-05-09 72 views
1

我正在试图在dashboardSidebar中建立一个闪亮的仪表板,页脚粘在视口的底部。对于这一点,我想使用自定义的CSS样式的建议here(一个许多搜索结果谷歌搜索“页脚底部引导”时):闪亮的仪表板:在仪表板中的粘滞页脚Sidebar

# create an example for the SO question on sticky footer 
library(shiny) 
library(shinydashboard) 

# sidebar 
so_sidebar = dashboardSidebar(
    sidebarMenu(
    menuItem(
     text = "Some text." 
    ) 
), 
    # footer here 
    tags$footer(
    tags$p("Footer message here."), 
    style = " 
     * { 
    margin: 0; 
    } 
    html, body { 
    height: 100%; 
    } 
    .wrapper { 
    min-height: 100%; 
    height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */ 
    height: 100%; 
    margin: 0 auto -155px; /* the bottom margin is the negative value of the footer's height */ 
    } 
    .footer, .push { 
    height: 155px; /* .push must be the same height as .footer */ 
    } 

    /* 

    Sticky Footer by Ryan Fait 
    http://ryanfait.com/ 

    */" 
) 

) 

# compose the dashboard 
so_ui = dashboardPage(
    header = dashboardHeader(
    title = "SO question" 
), 
    sidebar = so_sidebar, 
    body = dashboardBody() 
) 

# run the application 
shiny::shinyApp(
    ui = so_ui, 
    server = shinyServer(function(input, output) {}) 
) 

因为我从来没有与自定义的CSS工作之前,我不知道我正在使用CSS权利。我正在按照说明here

有人可以帮助获得这个CSS正确的,或任何其他建议粘着在Shiny Dashboard边栏的可视区域底部的页脚?

回答

2

尝试this

<div> 
    Sticky Footer 
</div> 

div{ 
    position:fixed; 
    bottom:0; 
    right:0; 
    left:0; 
    background:#00adfc; 
    padding:10px; 
    box-sizing:border-box; 
} 

位置始终固定停留在指定位置,并给出了发粘的感觉。

+0

谢谢你。但是,这不是Shiny特有的,我不知道如何实现这一点。 Shiny是一个通过编写R代码来生成HTML代码的R框架。 – tchakravarty

+0

其实,我得到了这个与Shiny一起工作 - 我将更新问题中的闪亮代码并标记此权利。我还有另一个问题。我怎样才能在这个文本的上方得到一个也固定在视口底部的图像? – tchakravarty