Jquery Animated Tab - revert on mouseout
I'm trying to adapt Gaya Design's Animated Tabbed Content http://www.gayadesign.com/diy/animated-tabbed-content-with-jquery/ for a navigation menu. I want to have the background verting back to the first tab on mouseout but can't seem to get that working. Below is the Javascript for moving background function:
var TabbedContent = { init: function() { $(".tab_item").mouseover(function() { var background = $(this).parent().find(".moving_bg"); $(background).stop().animate({ left: $(this).position()['left'] }, { 开发者_Python百科 duration: 300 }); TabbedContent.slideContent($(this)); }); }, } $(document).ready(function() { TabbedContent.init(); });
And here is a link to what I'm trying to achieve. Link
Any help on how to get the background to revert to tab one on mouseout will be very much appreciated!
Thanks
What about triggeting the mouseover event of the first item:
$('.tabs').mouseout(function(){
$(this).find('.tab_item:first').mouseover();
});
精彩评论