jquery sprite animation отзыв

Question

Я хочу заменить анимацию изображения gif с изображением спрайта. Проблема в том, что я использую отзывчивый дизайн. Поэтому, когда размер окна изменяется, вся «система» больше не работает. Гиф плохой, и процессор едет, но он масштабируется правильно.

Так что мой вопрос - так как я не нашел решения - возможно ли получить размер окна из фактического окна, масштабируя изображение до нужной высоты, ширины и, конечно, изменяет «прыжок» с 1-го изображения на второе изображение и так далее.

var scrollUp = (function() { 

    var timerId; 

    return function (height, times, element) { 
    var i = 0; 
    timerId = setInterval(function() { 
     if (i > times) 
     i = 0; 
     element.style.backgroundPosition = "0px -" + i * height + 'px'; 
     i ++; 
    }, 100 ); 
    }; 
})(); 

scrollUp(1200 , 6, document.getElementById('anim')) 

Так что в этом коде размер изображения установлен в 1200 году - тот прав, если дисплей 1980x1200, но по мере изменения дисплея, размер 1200 не так - он должен быть фактический размер дисплея - на В то же время изображение должно быть масштабировано до этого размера.

Возможно ли это как можно? Или у кого-то есть лучшая идея для оживленной анимации спрайтов?

возможно css3?

спасибо!

AD

Answer 1

$(window).resize(function myAss(){ //when window is resizing it starts 
    var wid = $(window).width(); 
    //or 
    var wid = $("#someid").width(); 
    //or 
    var wid = $(".someclass").width(); 
    $("#yourdiv").css("width",wid*0.5); //your div will be 50% of the received width. do same with the height if you want. 
} 

Answer 2

Я сделал это только с помощью CSS. Если ваш спрайт имеет (например) 5 изображений, то установите размер фона на 500%. Это сработало для меня. Working example.

Answer 3

Отъезд LazyLou и следите за обновлениями для v1.1. Я разработчик этого плагина, и я планирую добавить надстройку на v1.1. Первым дополнением для плагина будет аниматор.