сроки изменения JavaScript и SRC? - PullRequest
Новая
       9

сроки изменения JavaScript и SRC?

1 голос
/ 11 марта 2011

хорошо, поэтому у меня есть этот javascript, чтобы использовать клавиши со стрелками для отправки этих javascript, когда я нажимаю клавиши со стрелками. у меня есть совместный скрипт, который заставляет правильную ('img') команду переместить изображение, но я пытаюсь изменить изображение, когда оно движется с изменениями и задержками src. Помощь 

<script type="text/javascript">
document.onkeydown = KeyCheck;       
function KeyCheck(event) {

  var spacebar=32
  var KeyID = event.keyCode;
  switch(KeyID) {

      case 39:
        right('img'); 
        document.getElementById('img').src = 'guyr.png';
        setTimeout("right('img'); 
        document.getElementById('img').src = 'runr.png'; 
        setTimeout("right('img'); 
        document.getElementById('img').src = 'guyr.png';",100);",100);
      break;

   }

}
</script>

Ответы [ 2 ]

2 голосов
/ 11 марта 2011

Изменение атрибута src изображения вызовет асинхронный запрос GET и может сначала замедлиться, прежде чем браузер кэширует изображения. Похоже, вы реализуете какую-то игру? Вместо того, чтобы изменять src одного изображения, я бы изначально скрывал все изображения и переключал атрибут visibility CSS изображений, которые вы хотите показать / скрыть. Таким образом, вы можете предварительно выбрать все изображения, которые вам понадобятся во время загрузки, и просто показать / скрыть элементы в качестве обработчиков для ваших onkeydown событий.

1 голос
/ 11 марта 2011

Если вы хотите сделать какую-то игру или анимацию, попробуйте немного прочитать об этом, как структурировать игровой цикл, анимацию и т. Д.

Но если вы делаете какой-то тест, попробуйте что-то вроде этого, это не красивый код, но идея анимации должна работать: 

document.onkeydown = KeyCheck;

function KeyCheck(event) {

    var spacebar = 32;
    var KeyID = event.keyCode;

    switch (KeyID) {

    case 39:

        function guy(fn) {
            right('img');
            document.getElementById('img').src = 'guyr.png';
            setTimeout(function() {
                fn(guy);
            }, 100);
        }
        function run(fn) {
            right('img');
            document.getElementById('img').src = 'runr.png';
            setTimeout(function() {
                fn(run);
            }, 100);
        }

        guy(run);

        break;
    }

}

Одна функция вызывает другую, получая ее по параметру, чтобы продолжить анимацию.

...