How: 

Creating an Image View jCarousel Slider

Create a Image View [Procedure]

Configure the Image View to use the Juicebox slider

FORMAT

  1. Click on Content at Format: Unformatted list | Settings.
  2. Select the jCarousel option and click on Apply (all displays).
  3. Complete the following in the Style Options for the Juicebox (before clicking on Apply (all displays)):
    1. Number of Visible items - 4
    2. ADVANCED Start Position - 2

Add the Image View jCarousel slider Block to your page

CSS code for jcarousel slider

Process & steps here...

.jcarousel-skin-default .jcarousel-container-horizontal {
    height: auto;
    width: auto;
    margin: auto;
    padding: 20px 40px;
}
.jcarousel-skin-default .jcarousel-clip-horizontal {
    overflow: hidden;
    width: auto;
}
.jcarousel-skin-default .jcarousel-item {
    height: auto;
    width: auto !important;
}
.jcarousel-skin-default .jcarousel-next, .jcarousel-skin-default .jcarousel-prev {
    background-image: url("/sites/natural-sciences.nwu.ac.za/themes/bootstrap_nwu/arrows_jcarousel.png");
}
.jcarousel-skin-default .jcarousel-prev-horizontal {
    background-position: 0 0;    
    position:absolute;    
    left: 10px;
    top: 105px;    
}
.jcarousel-skin-default .jcarousel-next-horizontal {  
    background-position: 0 -32px;    
    position:absolute;
    right: 10px;   
    top: 105px;    
}

Description here