jquery live() with mouseover not working

Question

HI there

This is my code

$('.fc-event').live("mouseover",function(){
                                    if (!$(this).data("init")) {
                                        $(this).data("init", true);
                                        $(this).draggable({ 
                                             appendTo: 'body', 
                                             //opacity: 0.65, 
                                             revert: 'invalid', 
                                             scroll: true, 
                                             scrollSpeed: 50 
                                             });
                                        $(this).draggable(
                                            "option",
                                            "helper",
                                            function(){
                                                $('body').append('<div id="dragElement"></div>');
                                                $('#dragElement').maxZIndex({inc : 5});
                                                $('#dragElement').html($(this).find('.fc-event-title').html());
                                                return $('#dragElement'); 
                                            });
                                    }
                                });

This doesn't work... :( If I change the event for "hover" it will work (but only on mouseout... which I can't use). if I change the event for "click" it also works, just NOT "mouseover".

Any ideas?

Answer 1

You may be having issues because mouseover isn't what .hover() uses, it also fires for children. To get the .hover() equivalent you need mouseenter which doesn't fire when entering a child, like this:

$('.fc-event').live("mouseenter",function(){