Анимированная загрузка gif изображения в качестве повторяющегося фона

Question

Я хотел бы найти что-то вроде этого:

http://opengraphicdesign.com/wp-content/uploads/2009/01/bar180.gif

Но это может быть повторяющийся фон для элемента HTML и выглядит как целый блок.

Например, изображение в формате 80x80 в качестве повторяющегося фона в DIV 400x400, которое могло бы создать иллюзию большого анимированного изображения 400x400.

Answer 1

Я сделал это, после некоторой тонкой обрезки, я создал идеальное изображение для работы. Вот изображение GIF:

А вот и живая демка http://jsfiddle.net/dtxSW/94/

HTML:

<span></span>
<span></span>
<div></div>

CSS:

div {
  background:url('http://i.stack.imgur.com/tQTRW.gif') repeat;
  height: 500px;
}

span {
  width: 108px;
  height: 18px;
  display: block;
  background:url('http://i.stack.imgur.com/tQTRW.gif') repeat-x left;
}

Этот gif можно повторять бесконечно и все еще выглядеть как одно большое целое анимированное изображение.

Answer 2

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

Answer 3

Дай wegif.com попробуй