2013-09-30 1 views
0

Не понимаю, почему eventlister (скопированный из демонстрации) не работает, если я добавлю растровое изображение на сцену. Кажется, что битмап вызывает проблему, потому что если я добавлю еще один круг и т. Д., То щелчок работает нормально.Easeljs addEventListener не работает, когда битмап добавлен в этап

Смотрите пример:

<!DOCTYPE html> 
<html> 
<head> 
    <title>EaselJS demo: Simple animation</title> 
    <link href="../_shared/demo.css" rel="stylesheet" type="text/css"> 
    <script src="http://code.createjs.com/easeljs-0.7.0.min.js"></script> 
    <script>  
     var stage, circle; 
     var counter = 0; 
     var ticounter = 0 
     var images = [] 
     var mytext = 'kk'; 
     var lepakko; 
     var mx = 0; 
     function init() { 
      stage = new createjs.Stage("demoCanvas"); 

      var circle = new createjs.Shape(); 
      circle.graphics.beginFill("red").drawCircle(0, 0, 50); 
      circle.x = 500; 
      circle.y = 500; 

      stage.addChild(circle); 
      stage.update(); 
      lepakko = new createjs.Bitmap("halloween-bat.png"); 

      //Click works, if line below is commented out, why? 
      //stage.addChild(lepakko); 



      circle.addEventListener("click",circle_event); 
      stage.update(); 
     } 

     function circle_event(event) { 
      alert("clicked"); 
      }; 
    </script> 
</head> 
<body onLoad="init();"> 
    <canvas id="demoCanvas" width="700" height="700"> 
     alternate content 
    </canvas> 
</body> 
</html> 
+0

Возможно, ваше растровое изображение может быть очень большим и покрывающим круг? попробуйте сначала добавить растровое изображение, а затем круг и посмотреть, работает ли это. – olsn

+0

Bitmap не очень большой и не покрывает круг. Похоже, что это как-то уничтожает диспетчера событий круга. Это ошибка, или я делаю что-то неправильно? –

+0

Вы пробовали сначала добавить растровое изображение, а затем второе? – olsn

ответ

1

Клик не должен работать по умолчанию. В библиотеке EaselJS требуется явное включение события mouseover. Вам необходимо добавить:

stage.enableMouseOver(20); 

после создания сцены. Для того, чтобы изменить курсор на указатель, когда он над объектом есть свойство в EaselJS называется курсором:

// doesn't work, even if a function is decleared outside 
// circle.addEventListener("mouseover", function() { document.body.style.cursor = "pointer"; }); 
// this works 
circle.cursor = "pointer"; 

Метод enableMouseOver документирован на EaselJS website. Обратите внимание, что прослушивание мыши и других событий в EaselJS гораздо более требовательно к веб-браузеру.

 Смежные вопросы

  • Нет связанных вопросов^_^