核心:
代码语言:javascript复制<head>...
<!-- UNITE Gallery核心文件 -->
<script src='unitegallery/js/unitegallery.min.js' type='text/jаvascript'></script>
<link href='unitegallery/css/unite-gallery.css' rel='stylesheet' type='text/css' />
<!-- UNITE Gallery主题文件 -->
<script src='unitegallery/themes/compact/ug-theme-compact.js' type='text/jаvascript'></script>...</head>
<body>
<div id="gallery">...</div>
<script type="text/jаvascript">
jQuery(document).ready(function () {
jQuery("#gallery").unitegallery({
gallery_theme: "compact"
});
});
</script>
</body>
用法:
代码语言:javascript复制jQuery(document).ready(function(){
jQuery("#gallery").unitegallery({
gallery_theme: "compact",
//theme options
theme_panel_position: "bottom", //top, bottom, left, right - 拇指面板位置
theme_hide_panel_under_width: 480 //在特定浏览器宽度下隐藏面板,如果为空,则不隐藏
// gallery options
gallery_width:900, //gallery 宽度
gallery_height:500, //gallery 高度
gallery_min_width: 400, //调整大小时库的最小宽度
gallery_min_height: 300, //调整大小时库的最小高度
gallery_skin:"default", //default, alexis etc... - 画廊的全部皮肤。 默认情况下将更改所有画廊项目.
gallery_images_preload_type:"minimal", //all , minimal , visible - 全部、最小、可见 - 预加载类型的图像。.
//minimal - only image nabours will be loaded each time.
//visible - 每次都会加载可见的拇指图像.
//all - load all the images first time.
gallery_autoplay:false, //true / false - 在开始时开始幻灯片自动播放
gallery_play_interval: 3000, //幻灯片的播放间隔
gallery_pause_on_mouseover: true, //true,false - 播放幻灯片时鼠标悬停
gallery_control_thumbs_mousewheel:false, //true,false - 启用/禁用鼠标滚轮
gallery_control_keyboard: true, //true,false - 启用/消除键盘控件
gallery_carousel:true, //true,false - 最后一个图像上的“下一步”按钮转到第一个图像.
gallery_preserve_ratio: true, //true, false - 调整窗口大小时的保存比率
gallery_debug_errors:true, //当图库区域出现错误时显示错误消息.
gallery_background_color: "", //设置自定义背景颜色。如果未设置,它将从 css 中获取.
//slider options:
slider_scale_mode: "fill", //适合:缩小和放大图像以始终适合滑块
//down: 仅缩小,显示较小的图像,不要放大图像(放大)
//fill: 通过缩放、裁剪和居中图像来填充整个滑块空间
slider_scale_mode_media: "fill", //fit, down, 媒体项目的全比例模式
slider_scale_mode_fullscreen: "down", //fit, down, 全屏全比例模式.
slider_item_padding_top: 0, //填充滑块项目的顶部
slider_item_padding_bottom: 0, //填充滑块项的底部
slider_item_padding_left: 0, //填充滑块项的左侧
slider_item_padding_right: 0, //滑块项的右侧填充
slider_transition: "slide", //fade, slide - 幻灯片变化的过渡
slider_transition_speed:300, //幻灯片切换的过渡持续时间
slider_transition_easing: "easeInOutQuad", //幻灯片变化的过渡缓动功能
slider_control_swipe:true, //true,false - 启用滑动控制
slider_control_zoom:true, //true, false - 启用缩放控制
slider_zoom_max_ratio: 6, //最大缩放比
slider_loader_type: 1, //形状 (1-7)
slider_loader_color:"white", //颜色: (black , white)
slider_enable_bullets: false, //启用项目符号滑块元素
slider_bullets_skin: "", //皮肤如果为空,则从库皮肤继承
slider_bullets_space_between: -1, //设置项目符号之间的空间。 如果 -1 则将设置为皮肤的默认空间
slider_bullets_align_hor:"center", //left, center, right - 左、中、右 - 项目符号水平对齐
slider_bullets_align_vert:"bottom", //top, middle, bottom - 项目符号垂直对齐
slider_bullets_offset_hor:0, //项目符号水平偏移
slider_bullets_offset_vert:10, //项目符号垂直偏移
slider_enable_arrows: true, //启用滑块元素上的箭头
slider_arrows_skin: "", //滑块箭头的外观,如果为空,则从库外观继承
slider_arrow_left_align_hor:"left", //left, center, right - left arrow horizonal align - 左、中、右 - 左箭头水平对齐
slider_arrow_left_align_vert:"middle", //top, middle, bottom - left arrow vertical align - 顶部、中间、底部 - 左箭头垂直对齐
slider_arrow_left_offset_hor:20, //左箭头水平偏移
slider_arrow_left_offset_vert:0, //左箭头垂直偏移
slider_arrow_right_align_hor:"right", //left, center, right - right arrow horizontal algin - 左、中、右箭头水平对齐
slider_arrow_right_align_vert:"middle", //top, middle, bottom - right arrow vertical align - 顶部、中间、底部 - 向右箭头垂直对齐
slider_arrow_right_offset_hor:20, //向右箭头水平偏移
slider_arrow_right_offset_vert:0, //向右箭头垂直偏移
slider_enable_progress_indicator: true, //启用进度指示器元素
slider_progress_indicator_type: "pie", //pie, pie2, bar (不支持 pie, 会自动切换到 bar)
slider_progress_indicator_align_hor:"left", //left, center, right - progress indicator horizontal align - 左、中、右 - 进度指示器水平对齐
slider_progress_indicator_align_vert:"top", //top, middle, bottom - progress indicator vertical align - 顶部、中间、底部 - 进度指示器垂直对齐
slider_progress_indicator_offset_hor:16, //进度指示器水平偏移
slider_progress_indicator_offset_vert:36, //进度指示器垂直偏移
slider_progressbar_color:"#ffffff", //进度条颜色
slider_progressbar_opacity: 0.6, //进度条不透明度
slider_progressbar_line_width: 5, //进度条线宽
slider_progresspie_type_fill: false, //false is stroke, true is fill - the progress pie type, stroke of fill - false 是描边,true 是填充 - 进度条类型,填充描边
slider_progresspie_color1: "#B5B5B5", //进度条的第一种颜色
slider_progresspie_color2: "#E5E5E5", //进度条的第二种颜色
slider_progresspie_stroke_width: 6, //进度条描边宽度
slider_progresspie_width: 30, //进度条宽度
slider_progresspie_height:30, //进度条高度
slider_enable_play_button: true, //true,false - 启用滑块元素上的播放/暂停按钮
slider_play_button_skin: "", //滑块播放按钮的外观,如果为空,则从库外观继承
slider_play_button_align_hor:"left", //left, center, right - play button horizontal align - 左、中、右 - 播放按钮水平对齐
slider_play_button_align_vert:"top", //top, middle, bottom - play button vertical align - 顶部、中间、底部 - 播放按钮垂直对齐
slider_play_button_offset_hor:40, //播放按钮水平偏移
slider_play_button_offset_vert:8, //播放按钮垂直偏移
slider_enable_fullscreen_button: true, //true,false - 启用全屏按钮滑块元素
slider_fullscreen_button_skin: "", //滑块全屏按钮的外观,如果为空,则继承自库外观
slider_fullscreen_button_align_hor:"left", //left, center, right - 全屏按钮水平对齐
slider_fullscreen_button_align_vert:"top", //top, middle, bottom - 全屏按钮垂直对齐
slider_fullscreen_button_offset_hor:11, //全屏按钮水平偏移
slider_fullscreen_button_offset_vert:9, //全屏按钮垂直偏移
slider_enable_zoom_panel: true, //true,false - 启用缩放按钮,与缩放控件配合使用.
slider_zoompanel_skin: "", //滑块缩放面板的外观(如果为空,则从库外观继承
slider_zoompanel_align_hor:"right", //left, center, right - 缩放面板水平对齐
slider_zoompanel_align_vert:"top", //top, middle, bottom - 缩放面板垂直对齐
slider_zoompanel_offset_hor:12, //缩放面板水平偏移
slider_zoompanel_offset_vert:10, //缩放面板垂直偏移
slider_controls_always_on: true, //true,false - 控件始终打开,false - 仅在鼠标悬停时显示
slider_controls_appear_ontap: true, //true,false - 在触摸设备上的点击事件上显示控件
slider_controls_appear_duration: 300, //显示控件的持续时间
slider_videoplay_button_type: "square", //square, round - 视频播放按钮类型,方形或圆形
slider_enable_text_panel: false, //true,false - 启用“文本”面板
slider_textpanel_always_on: true, //true,false - 文本面板始终打开,false - 仅在鼠标悬停时显示
slider_textpanel_text_valign:"middle", //middle, top, bottom - 文本垂直对齐
slider_textpanel_padding_top:10, //文本面板填充顶部
slider_textpanel_padding_bottom:10, //文本面板底部填充
slider_textpanel_height: null, //文本面板高度。如果为 null,则将动态设置
slider_textpanel_padding_title_description: 5, //标题和说明之间的空格
slider_textpanel_padding_right: 11, //从右边为文本剪下一些空间
slider_textpanel_padding_left: 11, //从左边为文本剪下一些空间
slider_textpanel_fade_duration: 200, //文本面板的淡入淡出持续时间出现
slider_textpanel_enable_title: true, //启用标题文本
slider_textpanel_enable_description: true, //启用说明文本
slider_textpanel_enable_bg: true, //启用文本面板背景
slider_textpanel_bg_color:"#000000", //文本面板背景色
slider_textpanel_bg_opacity: 0.4, //文本面板背景不透明度
slider_textpanel_title_color:null, //文本面板标题颜色。如果为空 - 从 CSS 中获取
slider_textpanel_title_font_family:null, //文本面板标题字体系列。如果为空 - 从 CSS 中获取
slider_textpanel_title_text_align:null, //文本面板标题文本对齐。如果为空 - 从 CSS 中获取
slider_textpanel_title_font_size:null, //文本面板标题字体大小。如果为空 - 从 CSS 中获取
slider_textpanel_title_bold:null, //文本面板标题加粗。如果为空 - 从 CSS 中获取
slider_textpanel_css_title:{}, //文本面板标题的附加 CSS
slider_textpanel_desc_color:null, //文本面板说明字体系列。如果为空 - 从 CSS 中获取
slider_textpanel_desc_font_family:null, //文本面板说明字体系列。如果为空 - 从 CSS 中获取
slider_textpanel_desc_text_align:null, //文本面板说明文本对齐。如果为空 - 从 CSS 中获取
slider_textpanel_desc_font_size:null, //文本面板说明字体大小。如果为空 - 从 CSS 中获取
slider_textpanel_desc_bold:null, //文本面板说明粗体。如果为空 - 从 CSS 中获取
slider_textpanel_css_description:{}, //文本面板 描述的附加 CSS
slider_textpanel_bg_css:{}, //文本面板背景 CSS
//thumbs options
thumb_width:88, //拇指宽度
thumb_height:50, //拇指高度
thumb_fixed_size:true, //true,false - 固定/动态缩略图宽度
thumb_border_effect:true, //true, false - 指定拇指是否有边框
thumb_border_width: 0, //拇指边框宽度
thumb_border_color: "#000000", //拇指边框颜色
thumb_over_border_width: 0, //鼠标悬停状态下的拇指边框宽度
thumb_over_border_color: "#d9d9d9", //鼠标悬停状态下的拇指边框颜色
thumb_selected_border_width: 1, //选定状态下的拇指宽度
thumb_selected_border_color: "#d9d9d9", //选定状态下的拇指边框颜色
thumb_round_corners_radius:0, //拇指边框半径
thumb_color_overlay_effect: true, //true,false - 拇指颜色叠加效果,在鼠标悬停和选定状态时释放叠加
thumb_overlay_color: "#000000", //拇指叠加颜色
thumb_overlay_opacity: 0.4, //拇指叠加颜色不透明度
thumb_overlay_reverse:false, //true,false - 反转覆盖,将仅在选定状态下显示
thumb_image_overlay_effect: false, //true,false - 图像叠加效果仅对正常状态
thumb_image_overlay_type: "bw", //bw , blur, sepia - 图像效果叠加的类型,黑白,棕褐色和模糊.
thumb_transition_duration: 200, //拇指效果过渡持续时间
thumb_transition_easing: "easeOutQuad", //拇指效果过渡缓动
thumb_show_loader:true, //加载拇指时显示拇指加载器
thumb_loader_type:"dark", //dark, light - 拇指装载机类型
//stript thumbs panel options
strippanel_padding_top:8, //面板顶部的空间
strippanel_padding_bottom:8, //面板底部的空间
strippanel_padding_left: 0, //面板左侧间距
strippanel_padding_right: 0, //面板右侧的空间
strippanel_enable_buttons: false, //从面板两侧启用按钮
strippanel_buttons_skin: "", //按钮的皮肤,如果为空,则从库外观继承
strippanel_padding_buttons: 2, //按钮和面板之间的填充
strippanel_buttons_role : "scroll_strip", // scroll_strip, advance_item - 侧面按钮的作用
strippanel_enable_handle: true, //启用网格句柄
strippanel_handle_align: "top", //top, middle, bottom , left, right, center - 关闭手柄尖端根据面板方向对齐手柄杆
strippanel_handle_offset: 0, //根据 valign 的车把偏移
strippanel_handle_skin: "", //手柄的皮肤,如果为空,则从图库皮肤继承
strippanel_background_color:"", //条带包装器的背景颜色,如果未设置,它将取自 CSS
strip_thumbs_align: "left", //left, center, right, top, middle, bottom - 当拇指小于条带尺寸时对齐.
strip_space_between_thumbs:6, //拇指之间的空间
strip_thumb_touch_sensetivity:15, //从 1-100,1 - 最有意义,100 - 最无意义
strip_scroll_to_thumb_duration:500, //滚动到拇指的持续时间
strip_scroll_to_thumb_easing:"easeOutCubic", //简化滚动到拇指动画
strip_control_avia:true, //Avia 控制 - 根据条带位置移动条带
strip_control_touch:true, //触摸控制 - 通过拖动条带移动条
});
});
English文档
代码语言:javascript复制jQuery(document).ready(function(){
jQuery("#gallery").unitegallery({
gallery_theme: "compact",
//theme options
theme_panel_position: "bottom", //top, bottom, left, right - thumbs panel position
theme_hide_panel_under_width: 480 //hide panel under certain browser width, if null, don't hide
// gallery options
gallery_width:900, //gallery width
gallery_height:500, //gallery height
gallery_min_width: 400, //gallery minimal width when resizing
gallery_min_height: 300, //gallery minimal height when resizing
gallery_skin:"default", //default, alexis etc... - the global skin of the gallery. Will change all gallery items by default.
gallery_images_preload_type:"minimal", //all , minimal , visible - preload type of the images.
//minimal - only image nabours will be loaded each time.
//visible - visible thumbs images will be loaded each time.
//all - load all the images first time.
gallery_autoplay:false, //true / false - begin slideshow autoplay on start
gallery_play_interval: 3000, //play interval of the slideshow
gallery_pause_on_mouseover: true, //true,false - pause on mouseover when playing slideshow true/false
gallery_control_thumbs_mousewheel:false, //true,false - enable / disable the mousewheel
gallery_control_keyboard: true, //true,false - enable / disble keyboard controls
gallery_carousel:true, //true,false - next button on last image goes to first image.
gallery_preserve_ratio: true, //true, false - preserver ratio when on window resize
gallery_debug_errors:true, //show error message when there is some error on the gallery area.
gallery_background_color: "", //set custom background color. If not set it will be taken from css.
//slider options:
slider_scale_mode: "fill", //fit: scale down and up the image to always fit the slider
//down: scale down only, smaller images will be shown, don't enlarge images (scale up)
//fill: fill the entire slider space by scaling, cropping and centering the image
slider_scale_mode_media: "fill", //fit, down, full scale mode on media items
slider_scale_mode_fullscreen: "down", //fit, down, full scale mode on fullscreen.
slider_item_padding_top: 0, //padding top of the slider item
slider_item_padding_bottom: 0, //padding bottom of the slider item
slider_item_padding_left: 0, //padding left of the slider item
slider_item_padding_right: 0, //padding right of the slider item
slider_transition: "slide", //fade, slide - the transition of the slide change
slider_transition_speed:300, //transition duration of slide change
slider_transition_easing: "easeInOutQuad", //transition easing function of slide change
slider_control_swipe:true, //true,false - enable swiping control
slider_control_zoom:true, //true, false - enable zooming control
slider_zoom_max_ratio: 6, //max zoom ratio
slider_loader_type: 1, //shape of the loader (1-7)
slider_loader_color:"white", //color of the loader: (black , white)
slider_enable_bullets: false, //enable the bullets onslider element
slider_bullets_skin: "", //skin of the bullets, if empty inherit from gallery skin
slider_bullets_space_between: -1, //set the space between bullets. If -1 then will be set default space from the skins
slider_bullets_align_hor:"center", //left, center, right - bullets horizontal align
slider_bullets_align_vert:"bottom", //top, middle, bottom - bullets vertical algin
slider_bullets_offset_hor:0, //bullets horizontal offset
slider_bullets_offset_vert:10, //bullets vertical offset
slider_enable_arrows: true, //enable arrows onslider element
slider_arrows_skin: "", //skin of the slider arrows, if empty inherit from gallery skin
slider_arrow_left_align_hor:"left", //left, center, right - left arrow horizonal align
slider_arrow_left_align_vert:"middle", //top, middle, bottom - left arrow vertical align
slider_arrow_left_offset_hor:20, //left arrow horizontal offset
slider_arrow_left_offset_vert:0, //left arrow vertical offset
slider_arrow_right_align_hor:"right", //left, center, right - right arrow horizontal algin
slider_arrow_right_align_vert:"middle", //top, middle, bottom - right arrow vertical align
slider_arrow_right_offset_hor:20, //right arrow horizontal offset
slider_arrow_right_offset_vert:0, //right arrow vertical offset
slider_enable_progress_indicator: true, //enable progress indicator element
slider_progress_indicator_type: "pie", //pie, pie2, bar (if pie not supported, it will switch to bar automatically)
slider_progress_indicator_align_hor:"left", //left, center, right - progress indicator horizontal align
slider_progress_indicator_align_vert:"top", //top, middle, bottom - progress indicator vertical align
slider_progress_indicator_offset_hor:16, //progress indicator horizontal offset
slider_progress_indicator_offset_vert:36, //progress indicator vertical offset
slider_progressbar_color:"#ffffff", //progress bar color
slider_progressbar_opacity: 0.6, //progress bar opacity
slider_progressbar_line_width: 5, //progress bar line width
slider_progresspie_type_fill: false, //false is stroke, true is fill - the progress pie type, stroke of fill
slider_progresspie_color1: "#B5B5B5", //the first color of the progress pie
slider_progresspie_color2: "#E5E5E5", //progress pie second color
slider_progresspie_stroke_width: 6, //progress pie stroke width
slider_progresspie_width: 30, //progess pie width
slider_progresspie_height:30, //progress pie height
slider_enable_play_button: true, //true,false - enable play / pause button onslider element
slider_play_button_skin: "", //skin of the slider play button, if empty inherit from gallery skin
slider_play_button_align_hor:"left", //left, center, right - play button horizontal align
slider_play_button_align_vert:"top", //top, middle, bottom - play button vertical align
slider_play_button_offset_hor:40, //play button horizontal offset
slider_play_button_offset_vert:8, //play button vertical offset
slider_enable_fullscreen_button: true, //true,false - enable fullscreen button onslider element
slider_fullscreen_button_skin: "", //skin of the slider fullscreen button, if empty inherit from gallery skin
slider_fullscreen_button_align_hor:"left", //left, center, right - fullscreen button horizonatal align
slider_fullscreen_button_align_vert:"top", //top, middle, bottom - fullscreen button vertical align
slider_fullscreen_button_offset_hor:11, //fullscreen button horizontal offset
slider_fullscreen_button_offset_vert:9, //fullscreen button vertical offset
slider_enable_zoom_panel: true, //true,false - enable the zoom buttons, works together with zoom control.
slider_zoompanel_skin: "", //skin of the slider zoom panel, if empty inherit from gallery skin
slider_zoompanel_align_hor:"right", //left, center, right - zoom panel horizontal align
slider_zoompanel_align_vert:"top", //top, middle, bottom - zoom panel vertical align
slider_zoompanel_offset_hor:12, //zoom panel horizontal offset
slider_zoompanel_offset_vert:10, //zoom panel vertical offset
slider_controls_always_on: true, //true,false - controls are always on, false - show only on mouseover
slider_controls_appear_ontap: true, //true,false - appear controls on tap event on touch devices
slider_controls_appear_duration: 300, //the duration of appearing controls
slider_videoplay_button_type: "square", //square, round - the videoplay button type, square or round
slider_enable_text_panel: false, //true,false - enable the text panel
slider_textpanel_always_on: true, //true,false - text panel are always on, false - show only on mouseover
slider_textpanel_text_valign:"middle", //middle, top, bottom - text vertical align
slider_textpanel_padding_top:10, //textpanel padding top
slider_textpanel_padding_bottom:10, //textpanel padding bottom
slider_textpanel_height: null, //textpanel height. if null it will be set dynamically
slider_textpanel_padding_title_description: 5, //the space between the title and the description
slider_textpanel_padding_right: 11, //cut some space for text from right
slider_textpanel_padding_left: 11, //cut some space for text from left
slider_textpanel_fade_duration: 200, //the fade duration of textpanel appear
slider_textpanel_enable_title: true, //enable the title text
slider_textpanel_enable_description: true, //enable the description text
slider_textpanel_enable_bg: true, //enable the textpanel background
slider_textpanel_bg_color:"#000000", //textpanel background color
slider_textpanel_bg_opacity: 0.4, //textpanel background opacity
slider_textpanel_title_color:null, //textpanel title color. if null - take from css
slider_textpanel_title_font_family:null, //textpanel title font family. if null - take from css
slider_textpanel_title_text_align:null, //textpanel title text align. if null - take from css
slider_textpanel_title_font_size:null, //textpanel title font size. if null - take from css
slider_textpanel_title_bold:null, //textpanel title bold. if null - take from css
slider_textpanel_css_title:{}, //textpanel additional css of the title
slider_textpanel_desc_color:null, //textpanel description font family. if null - take from css
slider_textpanel_desc_font_family:null, //textpanel description font family. if null - take from css
slider_textpanel_desc_text_align:null, //textpanel description text align. if null - take from css
slider_textpanel_desc_font_size:null, //textpanel description font size. if null - take from css
slider_textpanel_desc_bold:null, //textpanel description bold. if null - take from css
slider_textpanel_css_description:{}, //textpanel additional css of the description
slider_textpanel_bg_css:{}, //textpanel background css
//thumbs options
thumb_width:88, //thumb width
thumb_height:50, //thumb height
thumb_fixed_size:true, //true,false - fixed/dynamic thumbnail width
thumb_border_effect:true, //true, false - specify if the thumb has border
thumb_border_width: 0, //thumb border width
thumb_border_color: "#000000", //thumb border color
thumb_over_border_width: 0, //thumb border width in mouseover state
thumb_over_border_color: "#d9d9d9", //thumb border color in mouseover state
thumb_selected_border_width: 1, //thumb width in selected state
thumb_selected_border_color: "#d9d9d9", //thumb border color in selected state
thumb_round_corners_radius:0, //thumb border radius
thumb_color_overlay_effect: true, //true,false - thumb color overlay effect, release the overlay on mouseover and selected states
thumb_overlay_color: "#000000", //thumb overlay color
thumb_overlay_opacity: 0.4, //thumb overlay color opacity
thumb_overlay_reverse:false, //true,false - reverse the overlay, will be shown on selected state only
thumb_image_overlay_effect: false, //true,false - images overlay effect on normal state only
thumb_image_overlay_type: "bw", //bw , blur, sepia - the type of image effect overlay, black and white, sepia and blur.
thumb_transition_duration: 200, //thumb effect transition duration
thumb_transition_easing: "easeOutQuad", //thumb effect transition easing
thumb_show_loader:true, //show thumb loader while loading the thumb
thumb_loader_type:"dark", //dark, light - thumb loader type
//stript thumbs panel options
strippanel_padding_top:8, //space from top of the panel
strippanel_padding_bottom:8, //space from bottom of the panel
strippanel_padding_left: 0, //space from left of the panel
strippanel_padding_right: 0, //space from right of the panel
strippanel_enable_buttons: false, //enable buttons from the sides of the panel
strippanel_buttons_skin: "", //skin of the buttons, if empty inherit from gallery skin
strippanel_padding_buttons: 2, //padding between the buttons and the panel
strippanel_buttons_role : "scroll_strip", // scroll_strip, advance_item - the role of the side buttons
strippanel_enable_handle: true, //enable grid handle
strippanel_handle_align: "top", //top, middle, bottom , left, right, center - close handle tip align on the handle bar according panel orientation
strippanel_handle_offset: 0, //offset of handle bar according the valign
strippanel_handle_skin: "", //skin of the handle, if empty inherit from gallery skin
strippanel_background_color:"", //background color of the strip wrapper, if not set, it will be taken from the css
strip_thumbs_align: "left", //left, center, right, top, middle, bottom - the align of the thumbs when they smaller then the strip size.
strip_space_between_thumbs:6, //space between thumbs
strip_thumb_touch_sensetivity:15, //from 1-100, 1 - most sensetive, 100 - most unsensetive
strip_scroll_to_thumb_duration:500, //duration of scrolling to thumb
strip_scroll_to_thumb_easing:"easeOutCubic", //easing of scrolling to thumb animation
strip_control_avia:true, //avia control - move the strip according strip moseover position
strip_control_touch:true, //touch control - move the strip by dragging it
});
});