Как я могу мигать с JQuery?

Question

Я хотел бы моргнуть текстом моего меню. У меня есть этот код, но он не работает с IE.

(function($)
{
    $.fn.blink = function(options) {
        var defaults = { delay:500 };
        var options = $.extend(defaults, options);

        return this.each(function() {
            var obj = $(this);
            setInterval(function() {
                if($(obj).css("color") == "rgb(255, 0, 0)")
                {
                    $(obj).css('color','#000000');
                }
                else
                {
                    $(obj).css('color','rgb(255, 0, 0)');
                }
            }, options.delay);
        });
    }
}(jQuery))

$(document).ready(function(){$('.blink').blink()})

Кто-нибудь может мне помочь? Спасибо!

Answer 1

Подключаемые модули Mini-Effects должны быть проще - очень маленькими и явно эффективными, если это все, что вам нужно из библиотеки эффектов пользовательского интерфейса (кроме этих других базовых элементов, "throb", "shake" и "bob").

Прост в использовании - просто загрузите нужный плагин мини-эффектов, затем просто вызовите blink() для элемента, который вы хотите мигать.

<script type="text/javascript" charset="utf-8" src="javascripts/jquery.blink.min.js"></script>

Затем просто вызовите blink() для какого-нибудь большого ярко окрашенного ресурса:

$(".selector").blink();

Answer 2

Вы устанавливаете obj как $(this), поэтому вы должны каждый раз вызывать obj вместо $(obj).

Просто замени

obj = $(this);

С просто

obj = this;

Но все же подумайте о людях с эпилепсией, плохим зрением и т. Д.

Answer 3

В проводнике:

if($(obj).css("color") == "rgb(255, 0, 0)")

это не так, потому что IE видит это:

 $(obj).css("color") == "rgb(255,0,0)";

Без пробелов между числами.

Вы можете исправить это, изменив:

$(obj).css('color','rgb(255, 0, 0)');

$(obj).css('color','rgb(255,0,0)');

а также

if($(obj).css("color") == "rgb(255, 0, 0)")

в

if($(obj).css("color") == "rgb(255,0,0)")

так:

(function($)
{
    $.fn.blink = function(options) {
        var defaults = { delay:500 };
        var options = $.extend(defaults, options);

        return this.each(function() {
            var obj = $(this);
            setInterval(function() {
                if($(obj).css("color") == "rgb(255,0,0)")
                {
                    $(obj).css('color','#000000');
                }
                else
                {
                    $(obj).css('color','rgb(255,0,0)');
                }
            }, options.delay);
        });
    }
}(jQuery))
$(document).ready(function(){$('.blink').blink()})

Редакция:

            (function($)
{
    $.fn.blink = function(options) {
        var defaults = { delay:500 };
        var options = $.extend(defaults, options);

        return this.each(function() {
            var obj = $(this);
            var state = false;
            setInterval(function() {
                if(state)
                {
                    $(obj).css('color','#000000');
                    state = false;
                }
                else
                {
                    $(obj).css('color','rgb(255,0,0)');
                    state = true;
                }
            }, options.delay);
        });
    }
}(jQuery))

Answer 4

Вы проверяли код с помощью Firebug или встроенных инструментов разработчика в Chrome? Я ожидаю, что вам нужно изменить

}(jQuery))

в

})(jQuery)

(переместите скобку вокруг...)