I recently needed to implement a scrolling gallery of images with hover over controls quickly without too much fuss. The result can be see here on the GUL Website in the history museum section.

I came across JCarousellite which is a lightweight version of JCarouselle.

This widget (based on JQuery) had pretty much everything I needed apart from handling mouse over for the previous and next controls.

Some quick modification allowed the controls to be clicked or hovered over and also provides a opacity change (JQuery fade) to add an effect as the user hovers over the controls.

There is probably a better way to get the continous scroll while the user hovers than using a timer to recall the scroll function but we needed a solution quick and it provides a nice way to pause slightly during the scroll so that the user can see the images.

The modifications required are made to the jcarousellite_1.0.1.js file as below:

          
            var t; 
            var d; 

            if (o.btnPrev)
                $(o.btnPrev).mouseover(function() {
                 t = setInterval(movePrev, 100);
                    $(this).fadeTo("fast", 1);
                });

            function movePrev() {
                go(curr - o.scroll);
            }

            if (o.btnPrev)
                $(o.btnPrev).mouseout(function() {
                    clearInterval(t);
                    $(this).fadeTo("fast", 0.5);
                });

            if (o.btnNext)
                $(o.btnNext).mouseover(function() {
                    d = setInterval(moveNext, 1);
                    $(this).fadeTo("fast", 1);
                });

            function moveNext() {
                go(curr + o.scroll);
            }

            if (o.btnNext)
                $(o.btnNext).mouseout(function() {
                    clearInterval(d);
                    $(this).fadeTo("fast", 0.5);
               });

Thats it, follow the instructions on the JCarousellite page to get it working, make these minor changes and that’s all there is to it.