Cycle Plugin: Turn the pager thumbnail into a slider

Question

I'm trying to work on a cycle image gallery and so far everything is working perfectly but I wanted to know if it was possible Turn the pager thumbnail into a slider.

I try this plugin simplyscroll and unfortunately it's not working. I don't know why maybe because there is a conflict between two plugin.

I just want to turn the thumb like image below:

Answer 1

In this case I have found that It is better to change the plugin you used, so I found that this plugin can handle it easy.

https://adgallery.codeplex.com/

ad gallery has already sliding thumbnail in the bottom part of the image and easy to used.

Answer 2

there is a slider plug-in on github link to GitHub Page I found this similar to your slider and you can see the live demo of there slider at priteshgupta.com/demos/templates/vivid-photo/ the thumbnails slide on Mousemove event

then i modified this slightly by adding my custom function for auto sliding the thumbnail

  for (var i = 0; i < 1500; i=i+30) {
     $thumbScroller_container.animate({left:-i}, $scrollEasing,$scrollEasingType); 
   }

ORIGINALLy IT WAS

$thumbScroller.mousemove(function(e){
        if($thumbScroller_container.width()>sliderWidth){
            var mouseCoords=(e.pageX - $placement[1]);
            var mousePercentX=mouseCoords/sliderWidth;
            var destX=-((((totalContent+($tsMargin*2))-(sliderWidth))-sliderWidth)*(mousePercentX));
            var thePosA=mouseCoords-destX;
            var thePosB=destX-mouseCoords;
            if(mouseCoords>destX){
                $thumbScroller_container.stop().animate({left: -thePosA}, $scrollEasing,$scrollEasingType); //with easing
            } else if(mouseCoords<destX){
                $thumbScroller_container.stop().animate({left: thePosB}, $scrollEasing,$scrollEasingType); //with easing
            } else {
                $thumbScroller_container.stop();  
            }
        }
});

now it will work as you stated in query this is changed preview link to demo js file which i edited Gallery page i edited if you want to access any event like click in jquery then you can use trigger for that