My goal here is to include bootstrap carousel in my UI. I want to do something like this but with bootstrap carousel My shiny UI like this :
source("entete.R")
source("accueil.R")
library(shiny)
shinyUI(
navbarPage("DPEE",tagList(
tags$head(
includeCSS("www/bootstrap.css"),
includeCSS("www/bootstrap.min.css"),
tags$script(src = "www/bootstrap.js"),
tags$script(src = "www/query-ui-1-11-4.min.js"),
tags$script('$(function(){$(".jui-tip").tooltip();});'),
tags$script('$(function(){$("div.divinput").accordion({
collapsible: true,heightStyle: "content" });});')
),
tags$div(class = "container-fluid", entete())),
tabPanel("Accueil", accueil()),
navbarMenu("Annuaire",
tabPanel("Prescolaire"),
tabPanel("Primaire"),
tabPanel("Secondaire 1"),
tabPanel("Secondaire 2")
)
))
and where accueil is bootstrap carousel.
accueil = function(){
tags$div( id = "moncarousel", class = "carousel slide",
tags$ol(class = "carousel-indic",
tags$li(`data-target` = "#moncarousel",`data-slide-to`="0", class="active"),
tags$li(`data-target`="#moncarousel",`data-slide-to` = "1"),
tags$li(`data-target`="#moncarousel",`data-slide-to`= "2")
),
tags$div(class="carousel-inner",
tags$div(class = "item active",
tags$img(src = "www/Koala1.jpg", class= "imag-responsive")),
tags$div(class = "item",
tags$img(src = "www/Koala2.jpg", class= "imag-responsive")),
tags$div(class = "item",
tags$img(src = "www/Koala3.jpg", class= "imag-responsive"))
))
}
This don't work.
I need help to put this in my shiny UI.
I was playing trying to build the complete shiny UI with HTML, the link to what I have done so far is here (it still needs some adjustment): Demo Shiny App
There is quite a bit of HTML there so I didn't want to post it here. Let me know if this help so that I can post he code.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With