Проблема совместимости с jQuery

Question

Я пытаюсь использовать небольшой плагин для анимации меню, который я нашел на http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/

Тем не менее, я хочу использовать его с последней версией jQuery. Однако анимация не работает с последней версией. Может кто-нибудь сказать мне, почему следующее будет работать с jQuery 1.5 и ниже, но теперь на версиях выше?

(function ($) {
    $.fn.lavaLamp = function (o) {
        o = $.extend({
            fx: "linear",
            speed: 500,
            click: function () {}
        }, o || {});
        return this.each(function () {
            var b = $(this),
                noop = function () {},
                $back = $('<li class="back"></li>').appendTo(b),
                $li = $("li", this),
                curr = $("li.current", this)[0] || $($li[0]).addClass("current")[0];
            $li.not(".back").mouseover(function () {
                move(this)
            }, noop);
            $(this).hover(noop, function () {
                move(curr)
            });
            setCurr(curr);

            function setCurr(a) {
                $back.css({
                    "left": a.offsetLeft + "px",
                    "width": a.offsetWidth + "px"
                });
                curr = a
            };

            function move(a) {
                $back.each(function () {
                    $.dequeue(this, "fx")
                }).animate({
                    width: a.offsetWidth,
                    left: a.offsetLeft
                }, o.speed, o.fx)
            }
        })
    }
})(jQuery);

Answer 1

Анимация работает для меня в IE8 и FF, используя демонстрацию, включенную в этот zip-файл, с использованием jQuery 1.7.1. Единственное, что мне пришлось изменить в файле примера, чтобы ссылки работали, это закомментировать возвращаемое значение false в событии click следующим образом:

$(function() {
    $("#1, #2, #3").lavaLamp({
        fx: "backout",
        speed: 700,
        click: function(event, menuItem) {
            //return false;
        }
    });
});

так как это мешало действительным ссылкам работать. В этом твоя проблема? Если нет, то, возможно, в вашем коде есть какая-то другая ошибка, которая, кажется, работает.

Answer 2

Проблема со строкой:

$li.not(".back").mouseover(function(){move(this)}, noop);

Выньте второй аргумент из обработчика, оставив:

$li.not(".back").mouseover(function(){move(this)});

Причина, по которой вы хотите использовать указатель мыши вместо наведения, заключается в том, что у вас есть элементы подменю. Использование hover имеет ошибку, из-за которой элемент подчеркивания сбрасывается обратно к первому элементу при наведении курсора на элементы подменю.

Answer 3

Вы всегда можете просто загрузить обе версии jquery. Используя noConflict, вы можете загрузить 1.5 для плагина, но используйте 1.7 для собственных нужд.