Match the height of one element to the second element. If the height of second element change, the height of first element will change automatically

heightMatcher(div1, div2, isID = TRUE)

Arguments

div1

element ID, or jquery selector if isID = FALSE. The first element that you want to match the height to the other element

div2

matched element ID or selector, the other element

isID

bool, if TRUE, div1 and div2 will be treated as ID, otherwise you can use complex jquery selector

Value

tagList containing javascript

Examples

if(interactive()){
    library(shiny)
    library(shinyjqui)
    ui <- fluidPage(
        column(
            3, id = "a",
            style = "border: 1px black solid; background-color: gray;",
            p("This block's height is matched with orange one")
        ),
        shinyjqui::jqui_resizable(column(
            2, id ="b",
            style = "border: 1px black solid; background-color: orange;",
            p("drag the bottom-right corner")
        )),
        column(
            3, id = "c",
            style = "border: 1px black solid; background-color: red;",
            p("This block's is not matched with others")
        ),
        heightMatcher("a", "b")
    )

    server <- function(input, output, session) {

    }
    # Try to drag `b` from bottom right corner and see what happens to `a`
    shinyApp(ui, server)
}