Carousel - Options
Basic carousel theme include:
<head>
...
<!-- Include Unite Gallery core files -->
<script src='unitegallery/js/unitegallery.min.js' type='text/javascript' ></script>
<link href='unitegallery/css/unite-gallery.css' rel='stylesheet' type='text/css' />
<!-- include Unite Gallery Theme Files -->
<script src='unitegallery/themes/carousel/ug-theme-carousel.js' type='text/javascript'></script>
...
</head>
<body>
<div id="gallery"> ... </div>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#gallery").unitegallery({
gallery_theme: "carousel"
});
});
</script>
</body>
All carousel theme related options:
jQuery(document).ready(function(){
jQuery("#gallery").unitegallery({
//main options:
tile_width: 160, //tile width
tile_height: 160, //tile height
theme_gallery_padding: 0, //the padding of the gallery wrapper
theme_carousel_align: "center", //the align of the carousel
theme_carousel_offset: 0, //the offset of the carousel from the align sides
//gallery options:
gallery_theme: "carousel" //choose gallery theme (if more then one themes includes)
gallery_width:"100%", //gallery width
gallery_min_width: 150, //gallery minimal width when resizing
gallery_background_color: "", //set custom background color. If not set it will be taken from css.
//carousel options
carousel_padding: 8, //padding at the sides of the carousel
carousel_space_between_tiles: 20, //space between tiles
carousel_navigation_numtiles:3, //number of tiles to scroll when user clicks on next/prev button
carousel_scroll_duration:500, //duration of scrolling to tile
carousel_scroll_easing:"easeOutCubic", //easing of scrolling to tile animation
carousel_autoplay: true, //true,false - autoplay of the carousel on start
carousel_autoplay_timeout: 3000, //autoplay timeout
carousel_autoplay_direction: "right", //left,right - autoplay direction
carousel_autoplay_pause_onhover: true, //pause the autoplay on mouse over
//navigation options
theme_enable_navigation: true,
theme_navigation_position: "bottom", //top,bottom: the vertical position of the navigation reative to the carousel
theme_navigation_enable_play: true, //enable / disable the play button of the navigation
theme_navigation_align: "center", //the align of the navigation
theme_navigation_offset_hor: 0, //horizontal offset of the navigation
theme_navigation_margin: 20, //the space between the carousel and the navigation
theme_space_between_arrows: 5 //the space between arrows in the navigation
//tile design options:
tile_enable_border:true, //enable border of the tile
tile_border_width:3, //tile border width
tile_border_color:"#F0F0F0", //tile border color
tile_border_radius:0, //tile border radius (applied to border only, not to outline)
tile_enable_outline: true, //enable outline of the tile (works only together with the border)
tile_outline_color: "#8B8B8B", //tile outline color
tile_enable_shadow:true, //enable shadow of the tile
tile_shadow_h:1, //position of horizontal shadow
tile_shadow_v:1, //position of vertical shadow
tile_shadow_blur:3, //shadow blur
tile_shadow_spread:2, //shadow spread
tile_shadow_color:"#8B8B8B", //shadow color
tile_enable_action: true, //enable tile action on click like lightbox
tile_as_link: false, //act the tile as link, no lightbox will appear
tile_link_newpage: true, //open the tile link in new page
tile_enable_overlay: true, //enable tile color overlay (on mouseover)
tile_overlay_opacity: 0.4, //tile overlay opacity
tile_overlay_color: "#000000", //tile overlay color
tile_enable_icons: true, //enable icons in mouseover mode
tile_show_link_icon: false, //show link icon (if the tile has a link). In case of tile_as_link this option not enabled
tile_space_between_icons: 26, //initial space between icons, (on small tiles it may change)
tile_enable_image_effect:false, //enable tile image effect
tile_image_effect_type: "bw", //bw, blur, sepia - tile effect type
tile_image_effect_reverse: false, //reverce the image, set only on mouseover state
//tile text panel options:
tile_enable_textpanel: false, //enable textpanel
tile_textpanel_source: "title", //title,desc,desc_title. source of the textpanel. desc_title - if description empty, put title
tile_textpanel_always_on: false, //textpanel always visible
tile_textpanel_appear_type: "slide", //slide, fade - appear type of the textpanel on mouseover
tile_textpanel_position:"inside_bottom", //inside_bottom, inside_top, inside_center, top, bottom the position of the textpanel
tile_textpanel_offset:0, //vertical offset of the textpanel
tile_textpanel_padding_top:8, //textpanel padding top
tile_textpanel_padding_bottom:8, //textpanel padding bottom
tile_textpanel_padding_right: 11, //cut some space for text from right
tile_textpanel_padding_left: 11, //cut some space for text from left
tile_textpanel_bg_opacity: 0.4, //textpanel background opacity
tile_textpanel_bg_color:"#000000", //textpanel background color
tile_textpanel_bg_css:{}, //textpanel background css
tile_textpanel_title_color:null, //textpanel title color. if null - take from css
tile_textpanel_title_font_family:null, //textpanel title font family. if null - take from css
tile_textpanel_title_text_align:null, //textpanel title text align. if null - take from css
tile_textpanel_title_font_size:null, //textpanel title font size. if null - take from css
tile_textpanel_title_bold:null, //textpanel title bold. if null - take from css
tile_textpanel_css_title:{}, //textpanel additional css of the title
tile_textpanel_desc_color:null, //textpanel description font family. if null - take from css
tile_textpanel_desc_font_family:null, //textpanel description font family. if null - take from css
tile_textpanel_desc_text_align:null, //textpanel description text align. if null - take from css
tile_textpanel_desc_font_size:null, //textpanel description font size. if null - take from css
tile_textpanel_desc_bold:null, //textpanel description bold. if null - take from css
tile_textpanel_css_description:{}, //textpanel additional css of the description
//lightbox options:
lightbox_type: "wide", //compact / wide - lightbox type
lightbox_hide_arrows_onvideoplay: true, //hide the arrows when video start playing and show when stop
lightbox_arrows_position: "sides", //sides, inside: position of the arrows, used on compact type
lightbox_arrows_offset: 10, //The horizontal offset of the arrows
lightbox_arrows_inside_offset: 10, //The offset from the image border if the arrows placed inside
lightbox_arrows_inside_alwayson: false, //Show the arrows on mouseover, or always on.
lightbox_overlay_color:null, //the color of the overlay. if null - will take from css
lightbox_overlay_opacity:1, //the opacity of the overlay. for compact type - 0.6
lightbox_top_panel_opacity: null, //the opacity of the top panel
lightbox_close_on_emptyspace:true, //close the lightbox on empty space
lightbox_show_numbers: true, //show numbers on the right side
lightbox_numbers_size: null, //the size of the numbers string
lightbox_numbers_color: null, //the color of the numbers
lightbox_numbers_padding_top:null, //the top padding of the numbers (used in compact mode)
lightbox_numbers_padding_right:null, //the right padding of the numbers (used in compact mode)
lightbox_slider_image_border: true, //enable border around the image (for compact type only)
lightbox_slider_image_border_width: 10, //image border width
lightbox_slider_image_border_color: "#ffffff", //image border color
lightbox_slider_image_border_radius: 0, //image border radius
lightbox_slider_image_shadow: true, //enable border shadow the image
lightbox_slider_control_swipe:true, //true,false - enable swiping control
lightbox_slider_control_zoom:true, //true, false - enable zooming control
//lightbox text panel:
lightbox_show_textpanel: true, //show the text panel
lightbox_textpanel_width: 550, //the width of the text panel. wide type only
lightbox_textpanel_enable_title: true, //enable the title text
lightbox_textpanel_enable_description: false, //enable the description text
lightbox_textpanel_padding_top:5, //textpanel padding top
lightbox_textpanel_padding_bottom:5, //textpanel padding bottom
lightbox_textpanel_padding_right: 11, //cut some space for text from right
lightbox_textpanel_padding_left: 11, //cut some space for text from left
lightbox_textpanel_title_color:null, //textpanel title color. if null - take from css
lightbox_textpanel_title_font_family:null, //textpanel title font family. if null - take from css
lightbox_textpanel_title_text_align:null, //textpanel title text align. if null - take from css
lightbox_textpanel_title_font_size:null, //textpanel title font size. if null - take from css
lightbox_textpanel_title_bold:null, //textpanel title bold. if null - take from css
lightbox_textpanel_css_title:{}, //textpanel additional css of the title
lightbox_textpanel_desc_color:null, //textpanel description font family. if null - take from css
lightbox_textpanel_desc_font_family:null, //textpanel description font family. if null - take from css
lightbox_textpanel_desc_text_align:null, //textpanel description text align. if null - take from css
lightbox_textpanel_desc_font_size:null, //textpanel description font size. if null - take from css
lightbox_textpanel_desc_bold:null, //textpanel description bold. if null - take from css
lightbox_textpanel_css_description:{}, //textpanel additional css of the description
});
});