Как использовать sprit'ы?
 

Искал в гугле как использовать спрайты... Про то как использовать css-спрайты мне известно, но тут-то так не сделаешь...В общем, в гугле нашел ток какую-то библиотеку для создания анимации с помощью спрайтов, но даже на примере, который был в архиве с библиотекой, нифига не понял, тем более, что там используется jquery, а я с этим вабще не знаком... В общем, прошу помощи - объясните, позязя, мне-слоупоку, как всё-таки сделать анимацию из спрайтов с помощью этой библиотеки...и можно ли вабще без нее (еси да, то объясните, плз, как)? И как использовать спрайты в canvas'е (я знаю, что в canvas'е можно спрайты использовать, где-то видел, но тож не знаю как)? Помогите, позязя)))
Зы: внизу прикрепил библиотеку и один спрайт, на примере которого прошу показать, как это делается...
И да, в примере из архива с библиотекой есть часть кода, где написано, чтобы в ишаке с фоном не было проблем - мне на ишак срать, так что можно не изворачиваться =)

Hekumok,
лениво смотреть

Основа - это позиционирование фона
http://htmlbook.ru/css/background-position
т.е любое изо больше размера элемента - по сути явлется спрайтом

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

Deff,
background-position это с css-спрайтами... И то, что вы написали, я знаю, но я не знаю, как это сделать!

Hekumok,
2-я картинка(прелоадер) http://s1.uploads.ru/i/nkepo.png просто двигает начальное смещение по Х в бекграуде
вот этого элемента <div id="preloader" style="background-position: -8px 0px"/> - красным - меняющаяся позиция
Первая картинка - делает тож самое - ток передвигает покадрово http://s1.uploads.ru/i/rZNAR.jpg (справо - налево
карочь -я походу не глядя описал оба случая

Deff, я знаю, что там идет смещение по иксу, но a как это сделать посекундно, чтоб как анимация? И как это сделать с другим спрайтом?

Hekumok,
движок выставляет setInerval
далее в нему(setInerval ) наращиваешь i++ и добавляешь к текущей позиции -выставляешь background-position: -XXXpx и смотришь: сравнялся ли правый край картинки( длина её известна) с правым краем твоего div - если сравнялся - сбрасываешь i на 0 и продолжаешь тоже самое. (*По кнопке стоп сlearInterval - что не ясно ?

Deff, просто я тупой слоупок))) огромное вам спасибо =)

Hekumok,
Там ксать движение влево(у прелоадера) - поэтому к позиции не добавляешь - а вычитаешь - тогда картинка от 0 - движецо влево до упора правым краем
а у анимашки первой смещение не на 1 пиксел за такт - а на ширину кадра

Deff, еще раз спасибо)))

а как это сделать в canvas'е - там же низзя спрайт в див загнать и background-position смещать?

ну что, никто не знает как использовать спрайты в canvas'е? :(

Hekumok,
я даже не представляю как их в канве использовать - представляю только css

все что есть по спрайтам в канвасе вот эта ссылка
http://updates.html5rocks.com/2012/0...-the-2D-canvas

Чёт та фигня какая-то...и на английском, блин

Ну я где-то видел это, ток не помню где

вот на русском
http://www.pixelcom.crimea.ua/html5-igry-canvas.html
там правда библиотека какая то используется

Спасибо, посмотрю...но, по-моему, я видел где-то прям без всяких библиотек и т.п.

Мне в canvas'е надо