Frully.org

让IE6支持hover的jQuery插件

这是一个让IE6支持hover的 jQuery 插件，除了普通的绑定事件方式外，它还可以以事件代理的方式工作。对于支持hover的浏览器，它不做任何事。

使用方式：

<style>
button:hover, button.hover {
}
table tr:hover, table tr.hover {
}
</style>
<script>
$(document).ready(function($) {
    $('button').fixie6Hover();
    $('table').fixie6Hover('tr'); //事件代理
});
</script>

源代码：

( function($) {
    if(!($.browser.msie && $.browser.version < 7)) {
        $.fn.fixie6Hover = function() {
            return this;
        };
        return;
    }
    var onMouseenter = function() {
        $(this).addClass('hover');
    };
    var onMouseleave = function() {
        $(this).removeClass('hover');
    };
    $.fn.fixie6Hover = function(selector) {
        if(selector) {
            this.bind('mouseover', function(event){;
                    if($(event.target).is(selector)) {
                        onMouseenter.call(event.target);
                    }
                })
                .bind('mouseout', function(event){;
                    if($(event.target).is(selector)) {
                        onMouseleave.call(event.target);
                    }
                });
        } else {
            this.bind('mouseenter', onMouseenter)
                .bind('mouseleave', onMouseleave);
        }
        return this;
    };
}(jQuery));

下面是一个更短小的仅 jQuery1.7+ 可用的版本：

( function($) {
    if(!($.browser.msie && $.browser.version < 7)) {
        $.fn.fixie6Hover = function() {
            return this;
        };
        return;
    }
    var events = {
        mouseenter : function() {
            $(this).addClass('hover');
        },
        mouseleave : function() {
            $(this).removeClass('hover');
        }
    };
    $.fn.fixie6Hover = function(selector) {
        if(selector) {
            this.on(events, selector);
        } else {
            this.on(events);
        }
        return this;
    };
}(jQuery));