Javascript hover effect

hii
i have used a javascript code for banner transition on a page in which i have give a time span for 8 sec for each banner after which the banner changes.
The banner also changes when the user clicks on any of the banners.

But what i want is to extend it a little further like this:
when the user hovers on any of the banners, the banner should change .

i have used the banner transition code from the following site:http://demo.webdeveloperplus.com/featured-content-slider/
thanks in advance…

It looks like that page just uses the jQuery UI framework…

And I think the jQuery UI framework supports tabs opening on mouseover:

Toggle sections open/closed on mouseover with the event option. The default value for event is “click.”


event: 'mouseover'

Can you show us your page as well?

Be wary of hover powered effects - hover events don’t get fired by touch devices (androids and iphones). Make sure the user can open the menu by clicking the main item instead of merely hovering on it.

As i mentioned above, its not for menu, actually its for banner transition effect.

yes, you can refer to the page at

http://www.masterworks.in/gauritech

You have this script at about line 17 in your HTML:


	    $(document).ready(function(){
        $("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 8000, true);
    });

Try adding event: “mouseover” to that first object, so that it looks like this:


	    $(document).ready(function(){
        $("#featured > ul").tabs({fx:{opacity: "toggle", event: "mouseover"}}).tabs("rotate", 8000, true);
    });

thanks for your quick reply.
but this code too does work as i want.