Skip to content

Commit c1f4878

Browse files
committed
fix: addresses pr feedback
1 parent 4ae47f0 commit c1f4878

File tree

4 files changed

+13
-15
lines changed

4 files changed

+13
-15
lines changed

Diff for: 7-animation/3-js-animation/1-animate-ball/solution.md

+2-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
Para quicar, podemos usar a propriedade CSS `top` e `position:absolute` para a bola dentro do campo com `position:relative`.
22

3-
A coordenada inferior do campo é `field.clientHeight`. Mas a propriedade `top` fornece coordenadas para o topo da bola, a posição da borda é `field.clientHeight - ball.clientHeight`.
3+
A coordenada inferior do campo é `field.clientHeight`. Mas a propriedade `top` fornece coordenadas para o topo da bola Então animamos a propriedade `top` a partir de `0` até `field.clientHeight - ball.clientHeight`, isto é até à posição mais baixa do topo da bola.
44

5-
Então animamos a propriedade `top` a partir de `0` até `field.clientHeight - ball.clientHeight`.
6-
7-
Para obter o efeito de "quique", podemos usar a função de tempo `bounce` no modo `easeOut`
5+
Para obter o efeito de "quique", podemos usar a função de tempo `bounce` no modo `easeOut`.
86

97
Aqui está o código final para a animação:
108

Diff for: 7-animation/3-js-animation/2-animate-ball-hops/solution.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@ A coordenada horizontal é modificada por outra regra: ela não "quica", mas gra
44

55
Podemos escrever mais um `animate` para isso.
66

7-
Como função de tempo podemos usar `liner`, mas algo como `makeEaseOut(quad)` parece bem melhor.
7+
Como função de tempo podemos usar `linear`, mas algo como `makeEaseOut(quad)` parece bem melhor.
88

99
O código:
1010

1111
```js
12-
let height = field.clientHeight - ball.clientHeight
13-
let width = 100
12+
let height = field.clientHeight - ball.clientHeight;
13+
let width = 100;
1414

15-
// animate top (bouncing)
15+
// anime o topo (quicando)
1616
animate({
1717
duration: 2000,
1818
timing: makeEaseOut(bounce),
@@ -21,7 +21,7 @@ animate({
2121
}
2222
});
2323

24-
// animate left (moving to the right)
24+
// anime a esquerda (movendo para a direita)
2525
animate({
2626
duration: 2000,
2727
timing: makeEaseOut(quad),

Diff for: 7-animation/3-js-animation/2-animate-ball-hops/task.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,6 @@ Faça a bola quicar para a direita. Assim:
88

99
[iframe height=250 src="solution"]
1010

11-
Escreva o código de animação. A distância para a esquerda é `100px`.
11+
Escreva o código da animação. A distância para a esquerda é `100px`.
1212

13-
Use a solução da atividade anterior <info:task/animate-ball> como a fonte.
13+
Use a solução da atividade anterior <info:task/animate-ball> como fonte.

Diff for: 7-animation/3-js-animation/text.view/index.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,12 @@
1010
<body>
1111
<textarea id="textExample" rows="5" cols="60">
1212
Ele pegou sua espada vorpal na mão:
13-
Faz tempo que o manxome inimigo que ele procurava -
13+
Faz tempo que o inimigo manxome que ele procurava -
1414
Então ele descansou perto da árvore Tumtum,
1515
E ficou um pouco em pensamento.
1616
</textarea>
1717

18-
<button onclick="animateText(textExample)">Run the animated typing!</button>
18+
<button onclick="animateText(textExample)">Execute o texto animado!</button>
1919

2020
<script>
2121
function animateText(textArea) {
@@ -26,7 +26,7 @@
2626
animate({
2727
duration: 5000,
2828
timing: bounce,
29-
draw: function(progress) {
29+
draw: function (progress) {
3030
let result = (to - from) * progress + from;
3131
textArea.value = text.substr(0, Math.ceil(result))
3232
}
@@ -43,4 +43,4 @@
4343
</script>
4444
</body>
4545

46-
</html>
46+
</html>

0 commit comments

Comments
 (0)