Блог

После запуска программы все работает нормально, пока я не протестирую код javascript, когда я нажимаю кнопку: один, css-наведение перестает работать с изображением: один, анимация при нажатии и если я указываю на объект . Работает только с позицией объекта в css. Я также использую eel в python, чтобы открыть окно приложения.

Питон

 import eel

eel.init("web")

eel.start("main.html", size=(284, 490))
 

HTML

 <script type="text/javascript">
    const buttons = {
       49: 'one'
    };


    document.onkeypress = function(evt) {
      console.log("Pressed")
      evt = evt || window.event;
      var charCode = evt.keyCode || evt.which;
      console.log(charCode);
      for(let key of Object.keys(buttons)) {
        if(charCode == key) {
          let id = buttons[key];
          let elm = document.getElementById(id).style;
          elm.position = 'relative';
          elm.transform = 'scaleX(0.9) scaleY(0.9)';
          setTimeout(() => elm.transform = 'scaleX(1) scaleY(1)', 200)
        }
      }
    };
  </script>
 

CSS

 #one {
    position: relative;
    top: -165px;
}

#one:hover{
        position: relative;
        transform: scaleX(1.05) scaleY(1.05);
        overflow: hidden;
    }

#one{
  transition:0.2s all ease-in;
}

#one:active{
    position: relative;
    transform: scaleX(0.9) scaleY(0.9);
    overflow: hidden;
}

#one{
  transition:0.1s all ease-in;
}