swiper: Create a swiper container

Description Usage Arguments Note Examples

View source: R/swiper.R

Description

A swiper container to include in a (fluidPage)

Usage

1
2
3
4
swiper(..., width = "600px", height = "300px", loop = TRUE,
  direction = c("horizontal", "vertical"), speed = 400,
  spaceBetween = 100, mousewheel = FALSE, navigation = FALSE,
  pagination = TRUE)

Arguments

...

Slot for swiperSlide.

width

swiper width in px or percentage.

height

swiper height in px or percentage.

loop

Whether to play slide in a loop. TRUE by default.

direction

Swiper direction: 'horizontal' or 'vertical'

speed

Swiper speed (ms).

spaceBetween

Space between slides in px, 100 by default.

mousewheel

Whether to enable mouse navigation. FALSE by default.

navigation

Whether to display arrow for navigation between slides. FALSE by default.

pagination

Whether to display bullet for pagination. TRUE by default.

Note

See http://idangero.us/swiper/api/#initialize for the detailed API description.

Examples

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
if (interactive()) {
 library(shiny)
 library(swipeR)

 shinyApp(
  ui = fluidPage(
   title = "Hello Shiny!",
   swiper(
     direction = "horizontal",
     mousewheel = TRUE,
     width = "100%",
     height = "800px",
     swiperSlide(img(src = "https://image.flaticon.com/icons/svg/165/165126.svg")),
     swiperSlide(
       tags$iframe(
         src = "http://www.rinterface.com/shiny/tablerDash/",
         width = "100%",
         frameBorder = "0",
         style = "position:fixed; height: calc(100% - 10px);"
       )
     ),
     swiperSlide(
      tags$iframe(
        width = "100%",
        height = "100%",
        src = "https://www.youtube.com/embed/u-Ofl67lz0g",
        frameborder = "0",
        allow = "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",
        allowfullscreen = NA
      )
     )
   )
  ),
  server = function(input, output) { }
 )
}

RinteRface/swipeR documentation built on Feb. 3, 2019, 12:39 a.m.