slider

<script type="text/javascript">
            $(function() {
                $('#thumbs').carouFredSel({
                    synchronise: ['#images', false, true],
                    auto: false,
                    width: 440,
                    items: {
                        visible: 3,
                        start: -1
                    },
                    height: 68,
                    scroll: {
                        onBefore: function( data ) {
                            
                            data.items.old.eq(1).removeClass('selected');
                            data.items.visible.eq(1).addClass('selected');
                            data.items.visible.eq(3).css({"margin-right":"100px"});
                            var img = $("#images img");
                                img = img[4];    
//                                       $(img).css({"width":"auto","height":"auto","max-height":"350px","max-width","350px"})
                            var imgW = $(img).width();
                            var imgH = $(img).height();
                            if(imgH < 350){
                                var marginTop = (350-imgH)/2;
                                $(img).css({"margin-top":marginTop+"px"})
                            }
                        }
                    },
                    prev: '#prev',
                    next: '#next'
                });

                $('#images').carouFredSel({
                    auto: false,
                    items: 1, 
                    scroll: {
                        fx: 'fade'
                    }
                });

                $('#thumbs img').click(function() {
                    $('#thumbs').trigger( 'slideTo', [this, -1] );
                });
                $('#thumbs img:eq(1)').addClass('selected'); 
                $("#thumbs").css({"height":"68px","left":"65px"});
            });
            
            $(document).ready(function(){
                
                // $('#images img').mouseover(function(){
                //     var thisImg = this;
                //     var img = $(this).css({"width":"auto","height":"auto"});
                //     // if($(thisImg).width()> 350 && $(thisImg).height() > 350){
                //         //  console.log("d d d d");    
                //         // console.log($(thisImg).width());
                //     if ($(thisImg).width() < 350 ) { 
                       
                //     };
                //     var img = $(this).css({"width":"auto","height":"auto"});

                //         $("#over-img").css({"z-index":"20"}).mousemove(function(e){  
                //             // console.log("ofset X");
                //             // console.log(e.offsetX);
                //             var overFlowX = 10+($(this).width()/$(thisImg).width())*(-(e.offsetX));
                //             var overFlowY = 10+($(this).height()/$(thisImg).height())*(-(e.offsetY)); 
                //             // console.log(overFlowX);
                //             $(thisImg).css({"margin-left":overFlowX+"px","margin-top":overFlowY+"px"});  

                //             $(this).mouseout(function(){ 
                //                 $(this).css({"z-index":""});
                //                 $(thisImg).css({"width":"350px","height":"350px"});
                //                 $(thisImg).css({"margin-left":"","margin-top":""});
                //             })
                //         })
                //     // }

                // });
 

               $("#info-border").customScrollbar();

 
            });
</script>