hover моргает

[Barsam]

Коллеги, здравствуйте!

Столкнулся с такой проблемой. Есть <input type="button">. У кнопки есть background и background:hover.

При наведении background заменяется на background:hover, но так как изображения hover нет в кеше, в момент замены кнопку дёргает.

Сразу оговорюсь, что применение спрайтов недопустимо.

Если кто-нибудь знает решение, просьба поделиться. Заранее спасибо за помощь.

Примечание: была идея прятать картинки, но в таком случае в кеш они не добавляются.

[lexxcode]

Сразу оговорюсь, что применение спрайтов недопустимо.

Но самое логичное применить спрайты....

А еще можно сделать прелоад на js в гугл вагон решений

[SelenIT]

А подложить одну из картинок под кнопку, и делать кнопку то непрозрачной, то прозрачной — не вариант?

[Barsam]

А подложить одну из картинок под кнопку, и делать кнопку то непрозрачной, то прозрачной — не вариант?

Может быть и вариант (этого я не пробовал), но будет ли подгружаться img при opacity: 0, вот это под большим сомнением. Да решение кажется слишком сложным, потому что в проекте таких кнопок около 10, и все их перевёрстывать, долго.

А насчёт применения скриптов... Я один пробовал. Не сработало. В данный момент ищу рабочий.

[Radiocity]

Примечание: была идея прятать картинки, но в таком случае в кеш они не добавляются.

А так пробовали?

http://jsfiddle.net/Radiocity/q8Nht/

[Barsam]

Примечание: была идея прятать картинки, но в таком случае в кеш они не добавляются.

А так пробовали?

http://jsfiddle.net/Radiocity/q8Nht/

Извините, я не понял. Это как? Может вы не то прислали.

Сразу оговорюсь, что применение спрайтов недопустимо.

Но самое логичное применить спрайты....

А еще можно сделать прелоад на js в гугл вагон решений

Если Вас не затруднит, приведите пример работающего JavaScripta.

Только что встраивал скрипт, не помогло.

[Barsam]

____________________________________________________________________________

Всем спасибо за участие. Проблема не решена, но ниже указанный плагин работает (для новичков: если будете использовать, не забудьте подключить jQuery).

(в моем случае из-за настроек сервера изображения не кешируются, но это уже проблема админов).

            (function ($) {
                var cache = [];
                $.preLoadImages = function () {
                    var args_len = arguments.length;
                    for (var i = args_len; i--; ) {
                        var cacheImage = document.createElement('img');
                        cacheImage.src = arguments[i];
                        cache.push(cacheImage);
                    }
                }
            })(jQuery)
            jQuery.preLoadImages("/new/images/hover_1.png", "/new/images/hover_2.png", "/new/images/hover_3.png");