Как сделать чтобы шар, когда достиг нужного размера, менял на другое эмодзи и не смогла менять размер?

@MKzzz · Регистрация: 29.10.2019

Студворк — интернет-сервис помощи студентам

Как сделать чтобы шар, когда достиг нужного размера ( в моем случае 600px), то менял на эмодзи "Boom" и данная эмодзи не смогла уже увеличиться и уменьшатся в размерах? Я пробовал написать так, но не работает:

JavaScript
1
2
3
4
5
if (size < 600 + "px"){
one.style.visibility= "hidden";
two.style.visibility= "visible";
blueRect.style.fontSize = size + 0 + "px";
}

Полный код:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <style>
    html, body{
        margin:0;
        overflow:hidden;
    }
    #blueRect{
        margin-left: auto;
        margin-right: auto;
        width:1000px;
        height:1000px;
        background-color: none;
        font-size: 500px;
        text-align: center;
        cursor: default;
    }
    .box1 {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  top: auto;
  bottom: auto;
  height: 1500px;
  width: 1000px;
}
.one { 
  height: 80%;
  width: 80%;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 1;
}
.two {
  visibility = hidden;
  height: 80%;
  width: 80%;
  position: absolute;
  left: 0px;
  top: 0px;
  visibility: hidden;
}
    </style>
</head>
<body>
<div class = "box1" id="blueRect">
<div class = "one" >������</div> /*эмодзи шарика*/
<div class = "two" >������</div> /*эмодзи взрыва*/
</div>
<script>
function moveRect(e){
     
    var blueRect = document.getElementById("blueRect");
    var cs = window.getComputedStyle(blueRect);
     
    
    var size = parseInt(cs.fontSize);
    switch(e.key)
    {        
        case "ArrowUp":       
                blueRect.style.fontSize = size + 10 + "px";
                if (size < 600 + "px"){
                one.style.visibility= "hidden";
                two.style.visibility= "visible";
                blueRect.style.fontSize = size + 0 + "px";
}
           break;
 
        case "ArrowDown":             
                blueRect.style.fontSize = size - 10 + "px";
           break;
    }
}
addEventListener("keydown", moveRect);
</script>
</body>
</html>

@Tavashi · 07.05.2021, 03:24

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <style>
      html,
      body {
        margin: 0;
        overflow: hidden;
      }
 
      #blueRect {
        margin-left: auto;
        margin-right: auto;
        width: 1000px;
        height: 1000px;
        background-color: none;
        font-size: 500px;
        text-align: center;
        cursor: default;
      }
 
      .box1 {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        top: auto;
        bottom: auto;
        height: 1500px;
        width: 1000px;
      }
 
      #one {
        height: 80%;
        width: 80%;
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: 1;
      }
 
      #two {
        height: 80%;
        width: 80%;
        position: absolute;
        left: 0px;
        top: 0px;
        visibility: hidden;
      }
 
    </style>
  </head>
 
  <body>
    <div class="box1" id="blueRect">
      <div id="one">������</div> /*эмодзи шарика*/
      <div id="two">������</div> /*эмодзи взрыва*/
    </div>
    <script>
      function moveRect(e) {
 
        var blueRect = document.getElementById("blueRect");
        var cs = window.getComputedStyle(blueRect);
 
        var size = parseInt(cs.fontSize);
        if (size > 600) {
          one.style.visibility = "hidden";
          two.style.visibility = "visible";
        } else {
          switch (e.key) {
            case "ArrowUp":
              blueRect.style.fontSize = size + 10 + "px";
              break;
 
            case "ArrowDown":
              blueRect.style.fontSize = size - 10 + "px";
              break;
          }
        }
      }
      addEventListener("keydown", moveRect);
 
    </script>
  </body>
</html>

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .	SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11680&d=1772460536 Одним из. . .	Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .
SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .	SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .