Как Сделать Движущийся Загрузчик Минимального Размера И Красиво

Хочу поделиться небольшой хитростью по созданию анимированной полосы загрузки как во флеш плеерах, так и в операционной системе.

У нас есть только картинка:

Как сделать движущийся загрузчик минимального размера и красиво

Как заставить его двигаться? И это очень просто! Вам нужно перемещать фон в интервале попиксельно.

Давайте посмотрим демо Если вы не смотрели исходный текст страницы, приведу код здесь:

var xPos=0; function move_bg(){ $("#load_td").

css( {backgroundPosition: xPos+'px 0px'} ); if(xPos == 60){ xPos=0; } xPos++; }

Функция в интервале, каждый вызов увеличивает на 1 значение, на которое нужно сдвинуть пиксель; когда значение достигает ширины фонового изображения, оно сбрасывается в 0, таким образом происходит невидимая замена.

Наверное метод используется уже давно, но я его придумал сам, надеюсь кому-то пригодится.

Теги: #jQuery #uploader #разработка веб-сайтов

Вместе с данным постом часто просматривают: