这是一款基于jssor.slider.js的炫酷jquery焦点图特效。该焦点图特效在底部带有缩略图，并且它在切换过渡是带有多种动画效果。该焦点图特效兼容ie8浏览器。

使用方法

在页面中引入样式文件jquery.min.js和jssor.slider.mini.js文件。

HTML结构

该焦点图的HTML结构如下：

    
    

        

        

    
    

        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        

            
            
        
        Image Gallery
    
    
    

        
        

            

                

                    

                
                

            
        
        
    
    
    
    

             
                

初始化插件

在页面DOM元素加载完毕之后，可以通过下面的方法来初始化该焦点图插件。

jQuery(document).ready(function ($) {
    //Define an array of slideshow transition code
    var _SlideshowTransitions = [
    { code1 },
    { code2 },
    { code3 }
    ];
    var options = {
        $AutoPlay: true,
        $SlideshowOptions: {
                $Class: $JssorSlideshowRunner$,
                $Transitions: _SlideshowTransitions,
                $TransitionsOrder: 1,
                $ShowLink: true
            }
    };
    var jssor_slider1 = new $JssorSlider$('slider1_container', options);
});
                

jssor.slider.js焦点图插件的可用配置参数可以查看：http://www.jssor.com/development/reference-options.html

jssor.slider.js焦点图插件的github地址为：https://github.com/jssor/slider