diff --git a/css-animations-ja.html b/css-animations-ja.html
index 5e3ed4060..443bb8249 100644
--- a/css-animations-ja.html
+++ b/css-animations-ja.html
@@ -92,31 +92,29 @@
function create_html(match, key, indicator, klass){
if(!indicator) {//%
- return '' + match.slice(1) + '';
+ return `${match.slice(1)}`;
}
let text = key;
let href = '';
-let classname = class_map[klass];
-let tag = tag_map[klass];
switch(klass){
case 'r': // ref
- text = '[' + key + ']';
- href = '#biblio-' + key.toLowerCase();
+ text = `[${key}]`;
+ href = `#biblio-${key.toLowerCase()}`;
break;
case 'prod': // production
case 't': // typedef
- text = '<' + key + '>';
+ text = `<${key}>`;
break;
case 'at': // at-rule
- text = '@' + key;
+ text = `@${key}`;
break;
case 'ps': // pseudo-class
- text = ':' + key;
+ text = `:${key}`;
break;
case 'pe': // pseudo-element
- text = '::' + key;
+ text = `::${key}`;
break;
case 'm': // IDL member
const n = text.indexOf('(');
@@ -128,14 +126,15 @@
default:
}
+let tag = tag_map[klass];
if(tag) {
- text = '<' + tag + (
- classname ? ' class="' + classname + '"' : ''
- ) + '>' + text + '';
+ let classname = class_map[klass];
+ classname = classname ? ` class="${classname}"` : '';
+ text = `<${tag}${classname}>${text}`;
}
if(indicator !== '^'){
- href = link_map[klass ? (klass + '.' + key) : key] || href;
+ href = link_map[ klass ? `${klass}.${key}` : key ] || href;
if(!href){
console.log(match); // check error
return match;
@@ -143,10 +142,10 @@
switch(indicator){
case '$':
- text = '' + text + '';
+ text = `${text}`;
break;
case '@':
- text = '' + text + '';
+ text = `${text}`;
break;
}
}
@@ -311,7 +310,7 @@
過去:past:~
即時:immediate:~
瞬時:instantaneous:~
-計時:timing::~:タイミング
+easing:
移動-:move::~
移行-:move:~
@@ -791,7 +790,7 @@
t.single-animation-name:#typedef-single-animation-name
t.single-animation-play-state:#typedef-single-animation-play-state
t.single-animation:#typedef-single-animation
-t.timing-function:~CSSEASING#typedef-timing-function
+t.easing-function:~CSSEASING#typedef-easing-function
t.declaration-list:~CSSSYN#typedef-declaration-list
t.rule-list:~CSSSYN#typedef-rule-list
@@ -814,9 +813,9 @@
v.reverse:#valdef-animation-direction-reverse
v.running:#valdef-animation-play-state-running
-v.ease-in-out:~CSSEASING#valdef-cubic-bezier-timing-function-ease-in-out
-v.ease-in:~CSSEASING#valdef-cubic-bezier-timing-function-ease-in
-v.ease-out:~CSSEASING#valdef-cubic-bezier-timing-function-ease-out
+v.ease-in-out:~CSSEASING#valdef-cubic-bezier-easing-function-ease-in-out
+v.ease-in:~CSSEASING#valdef-cubic-bezier-easing-function-ease-in
+v.ease-out:~CSSEASING#valdef-cubic-bezier-easing-function-ease-out
v.start:~CSSEASING#valdef-steps-start
●IDL
@@ -910,8 +909,8 @@
入力~進捗~値:~CSSEASING#input-progress-value
出力~進捗~値:~CSSEASING#output-progress-value
-階段~計時~関数:~CSSEASING#step-timing-function
-計時~関数:~CSSEASING#timing-function
+階段~easing関数:~CSSEASING#step-easing-function
+~easing関数:~CSSEASING#easing-function
段~位置:~CSSEASING#step-position
指定d順:~CSSOM1#concept-declarations-specified-order
@@ -1653,10 +1652,10 @@
4. ~keyframe
-
4.1.~keyframe用の計時~関数
+
4.1.~keyframe用の~easing関数
-それぞれの `~keyframe~style規則$では、~animationが次の~keyframeへ移行するときに利用される`計時~関数$を宣言できる。
+それぞれの `~keyframe~style規則$では、~animationが次の~keyframeへ移行するときに利用される`~easing関数$を宣言できる。
◎
A keyframe style rule may also declare the timing function that is to be used as the animation moves to the next keyframe.
-"`to^v" （ `100%^v ）~keyframe上に指定されている`計時~関数$は，無視される。
+"`to^v" （ `100%^v ）~keyframe上に指定されている`~easing関数$は，無視される。
◎
A timing function specified on the to or 100% keyframe is ignored.
@@ -1900,10 +1899,10 @@
4.3. `animation-duration^p ~prop
4.4. `animation-timing-function^p ~prop
-`animation-timing-function$p ~propは、`計時~関数$
+`animation-timing-function$p ~propは、`~easing関数$
— ~animationが 各~keyframe間で どう進捗するか —
を記述する。
-計時~関数は、 `CSS-EASING-1$r にて別に定義される。
+~easing関数は、 `CSS-EASING-1$r にて別に定義される。
◎
The animation-timing-function property describes how the animation will progress between each pair of keyframes. Timing functions are defined in the separate CSS Easing Functions module [css-easing-1].
@@ -1923,7 +1922,7 @@
4.4. `animation-timing-functi
注記：
この定義は必要とされる
-— さもなければ，`計時~関数$が`階段~計時~関数$であって，その`段~位置$が `start$v にされている場合、 `backwards$v による`延伸$の間，関数の最初の段の上端側の`出力~進捗~値$を生産することになるので。
+— さもなければ，`~easing関数$が`階段~easing関数$であって，その`段~位置$が `start$v にされている場合、 `backwards$v による`延伸$の間，関数の最初の段の上端側の`出力~進捗~値$を生産することになるので。
◎
Note: This definition is necessary because otherwise a step timing function with a step position of start would produce a backwards fill equal to the top of the first step in the function.
-この~CSS~moduleは、作者が，~animationの時間次元に適用される変形を定義する仕方を述べる。
-これを利用すれば、慣性などの物理的な現象を模倣したり, ~robotの様にカクカク動く~animationを生産できる。
+この~CSS~moduleは、作者が，値の変化~率を制御する変形を定義する仕方を述べる。
+~animationに適用された場合、そのような変形を利用すれば，慣性などの物理的な現象を模倣したり, ~robotの様にカクカク動く~animationを生産できる。
◎
-This CSS module describes a way for authors to define a transformation to be applied to the time of an animation. This can be used to produce animations that mimic physical phenomena such as momentum or to cause the animation to move in discrete steps producing robot-like movement.
+This CSS module describes a way for authors to define a transformation that controls the rate of change of some value. Applied to animations, such transformations can be used to produce animations that mimic physical phenomena such as momentum or to cause the animation to move in discrete steps producing robot-like movement.
-~animationの進捗~率を制御したいと欲されることは多い。
+何らかの値の変化~率を制御したいと欲されることは多い。
例えば、動きが加速され，次第に勢いが増す要素には、重さがあるような感覚を与えれる。
-これを利用すれば、利用者に直感的な~UI要素や，物理的に本物らしく挙動する~cartoon-propsを生産できる。
+これを利用すれば、直感的な~UI要素や，物理的に本物らしく挙動する~cartoon-propsを生産できる。
また、歯が常に同じ位置に現れるように回転する歯車など，飛び飛びに動く~animationが欲されることも ときにはある。
◎
-It is often desirable to control the rate at which an animation progresses. For example, gradually increasing the speed at which an element moves can give the element a sense of weight as it appears to gather momentum. This can be used to produce user intuitive interface elements or convincing cartoon props that behave like their physical counterparts. Alternatively, it is sometimes desirable for animation to move forwards in distinct steps such as a segmented wheel that rotates such that the segments always appear in the same position.
+It is often desirable to control the rate at which some value changes. For example, gradually increasing the speed at which an element moves can give the element a sense of weight as it appears to gather momentum. This can be used to produce intuitive user interface elements or convincing cartoon props that behave like their physical counterparts. Alternatively, it is sometimes desirable for animation to move forwards in distinct steps such as a segmented wheel that rotates such that the segments always appear in the same position.
-`計時~関数$は、入力~進捗~値から対応する出力~進捗~値を生産することにより，~animationの時間次元を変形する手段を供する。
+同様に，~gradient補間の変化~率の制御を利用すれば、［
+面の凹凸を示唆する／縞模様の効果
+］などの種々の視覚的な効果を生産できる。
◎
-Timing functions provide a means to transform animation time by taking an input progress value and producing a corresponding transformed output progress value.
+Similarly, controlling the rate of change of gradient interpolation can be used to produce different visual effects such as suggesting a concave or convex surface, or producing a striped effect.
-`timing-function-example^dgm
+
+`~easing関数$は、入力~進捗~値から対応する出力~進捗~値を生産することにより，そのような値を変形する手段を供する。
+◎
+Easing functions provide a means to transform such values by taking an input progress value and producing a corresponding transformed output progress value.
+
+
+`easing-function-example^dgm
-`ease-in^v 効果を生産する計時~関数の例。
-この計時~関数は、入力~進捗~値 0.7 に対しては，出力~進捗 0.52 を生産する。
-この計時~関数を適用することにより、~animationは，最初は低速に, 徐々に早く進捗するようになる。
+`ease-in^v 効果を生産する~easing関数の例。
+この~easing関数は、入力~進捗~値 0.7 に対しては，出力~進捗 0.52 を生産する。
+この~easing関数を~animationに適用すれば、~animationは，最初は低速に, 徐々に早く進捗するようになる。
◎
-Example of a timing function that produces an ease-in effect. Given an input progress of 0.7, the timing function scales the value to produce an output progress of 0.52. By applying this timing function, the animation will progress more slowly at first but then gradually progress more quickly.
+Example of an easing function that produces an ease-in effect. Given an input progress of 0.7, the easing function scales the value to produce an output progress of 0.52. Applying this easing function to an animation would cause it to progress more slowly at first but then gradually progress more quickly.
-
-
2. 計時~関数
+
+
2. ~easing関数
-`計時~関数@
-（ `timing function^en ）は、`入力~進捗~値$から`出力~進捗~値$を生産する。
+`~easing関数@
+【 “加減速” 関数】は、`入力~進捗~値$から`出力~進捗~値$を生産する。
◎
-A timing function takes an input progress value and produces an output progress value.
+An easing function takes an input progress value and produces an output progress value.
-`計時~関数$は、純粋な関数でなければナラナイ
+`~easing関数$は、純粋な関数でなければナラナイ
— すなわち、同じ入力に対しては，常に同じ`出力~進捗~値$を生産する。
◎
-A timing function must be a pure function meaning that for a given set of inputs, it always produces the same output progress value.
+An easing function must be a pure function meaning that for a given set of inputs, it always produces the same output progress value.
`入力~進捗~値@
は，範囲 [-∞, ∞] に入る実数であり。
-その範囲は概して [0, 1] になるが、複数の`計時~関数$が連鎖される事例ではそうなるとは限らない。
+その範囲は概して [0, 1] になるが、複数の`~easing関数$が連鎖される事例ではそうなるとは限らない。
◎
-The input progress value is a real number in the range [-∞, ∞]. Typically, the input progress value is in the range [0, 1] but this may not be the case when timing functions are chained together.
+The input progress value is a real number in the range [-∞, ∞]. Typically, the input progress value is in the range [0, 1] but this may not be the case when easing functions are chained together.
@@ -628,87 +660,87 @@
2. 計時~関数
-一部の種の計時~関数は、後述する追加的な`直前~flag$も入力にとる。
+一部の種の~easing関数は、後述する追加的な`直前~flag$も入力にとる。
◎
-Some types of timing function also take an additional boolean before flag input which is defined subsequently.
+Some types of easing functions also take an additional boolean before flag input which is defined subsequently.
-この仕様は、以下に与える 4 種の計時~関数を定義する。
+この仕様は、以下に与える 4 種の~easing関数を定義する。
◎
-This specification defines four types of timing functions whose definitions follow.
+This specification defines four types of easing functions whose definitions follow.
-`計時~関数$を指定するための構文は、次に従う：
+`~easing関数$を指定するための構文は、次に従う：
◎
-The syntax for specifying a timing function is as follows:
+The syntax for specifying an easing function is as follows:
-`線型~計時~関数@
+`線型~easing関数@
は、恒等~関数である
— すなわち、どの入力に対しても，`入力~進捗~値$と`出力~進捗~値$は等しくなる。
◎
-The linear timing function is an identity function meaning that its output progress value is equal to the input progress value for all inputs.
+The linear easing function is an identity function meaning that its output progress value is equal to the input progress value for all inputs.
-`線型~計時~関数$の構文は、単に
+`線型~easing関数$の構文は、単に
`linear@v
~keywordである。
◎
-The syntax for the linear timing function is simply the linear keyword.
+The syntax for the linear easing function is simply the linear keyword.
-`~cubic~Bezier計時~関数@
-は、`計時~関数$の一種であり，~cubic~Bezier曲線の
+`~cubic~Bezier~easing関数@
+は、`~easing関数$の一種であり，~cubic~Bezier曲線の
2 個の制御点 %P1, %P2 を指定する 4 個の実数で定義される。
曲線の端点 %P0, %P3 は、順に固定的な点
( 0, 0 ), ( 1, 1 )
で与えられる。
%P1, %P2 の %x 座標は、範囲 [0, 1] に制約される。
◎
-A cubic Bézier timing function is a type of timing function defined by four real numbers that specify the two control points, P1 and P2, of a cubic Bézier curve whose end points P0 and P3 are fixed at (0, 0) and (1, 1) respectively. The x coordinates of P1 and P2 are restricted to the range [0, 1].
+A cubic Bézier easing function is a type of easing function defined by four real numbers that specify the two control points, P1 and P2, of a cubic Bézier curve whose end points P0 and P3 are fixed at (0, 0) and (1, 1) respectively. The x coordinates of P1 and P2 are restricted to the range [0, 1].
-`cubic-bezier-timing-curve^dgm
+`cubic-bezier-easing-curve^dgm
-計時~関数として利用される~cubic~Bezier曲線。
+~easing関数として利用される~cubic~Bezier曲線。
曲線の形状は、制御点 %P1, %P2 の所在により決定される。
入力~進捗~値／出力~進捗~値
は、曲線の
%x 値 ／ %y 値
として~~働く。
◎
-A cubic Bézier curve used as a timing function. The shape of the curve is determined by the location of the control points P1 and P2. Input progress values serve as x values of the curve, whilst the y values are the output progress values.
+A cubic Bézier curve used as an easing function. The shape of the curve is determined by the location of the control points P1 and P2. Input progress values serve as x values of the curve, whilst the y values are the output progress values.
-`~cubic~Bezier計時~関数$の構文は、次で与えられる（ `CSS3VAL$r による記法を利用して）：
+`~cubic~Bezier~easing関数$の構文は、次で与えられる（ `CSS3VAL$r による記法を利用して）：
◎
-A cubic Bézier timing function has the following syntax (using notation from [CSS3VAL]):
+A cubic Bézier easing function has the following syntax (using notation from [CSS3VAL]):
-`~cubic~Bezier計時~関数$を指定する。
+`~cubic~Bezier~easing関数$を指定する。
4 個の実数は、順に
( %x1, %y1, %x2, %y2 )
として、曲線の点 %P1, %P2 を指定する。
%x1, %x2 とも範囲 [0, 1] に入っていなければナラナイ
— さもなければ定義は無効になる。
◎
-Specifies a cubic Bézier timing function. The four numbers specify points P1 and P2 of the curve as (x1, y1, x2, y2). Both x values must be in the range [0, 1] or the definition is invalid.
+Specifies a cubic Bézier easing function. The four numbers specify points P1 and P2 of the curve as (x1, y1, x2, y2). Both x values must be in the range [0, 1] or the definition is invalid.
-`階段~計時~関数@
-は、`計時~関数$の一種であり，入力~時間軸を指定された個数の時区間に等分する。
+`階段~easing関数@
+は、`~easing関数$の一種であり，入力~時間軸を指定された個数の時区間に等分する。
それは［
`段数$,
`段~位置$
］で定義される。
その構文は：
◎
-A step timing function is a type of timing function that divides the input time into a specified number of intervals that are equal in length. It is defined by a number of steps, and a step position. It has following syntax:
+A step easing function is a type of easing function that divides the input time into a specified number of intervals that are equal in length. It is defined by a number of steps, and a step position. It has following syntax:
-段の境目における`階段~計時~関数$の結果は，概念的には 境目の直後の段に対応するが、入力として追加的な
+段の境目における`階段~easing関数$の結果は，概念的には 境目の直後の段に対応するが、入力として追加的な
`直前~flag@
が ~ON にされて渡された場合の結果は，境目の直前の段に対応する。
◎
-At the exact point where a step occurs, the result of the function is conceptually the top of the step. However, an additional before flag passed as input to the step timing function, if true, will cause the result of the function to correspond to the bottom of the step at the step point.
+At the exact point where a step occurs, the result of the function is conceptually the top of the step. However, an additional before flag passed as input to the step easing function, if true, will cause the result of the function to correspond to the bottom of the step at the step point.
◎
-As an example of how the before flag affects the behavior of this function, consider an animation with a step timing function whose step position is start and which has a positive delay and backwards fill.
+As an example of how the before flag affects the behavior of this function, consider an animation with a step easing function whose step position is start and which has a positive delay and backwards fill.
@@ -1055,16 +1086,16 @@
2.3.1. 階段~計時~関数の出
-遅延~段階における`入力~進捗~値$は 0 になるが、~animation時区間にまだ達していないことを指示するため，`直前~flag$は ~ON にされ†、計時~関数が生産する`出力~進捗~値$は，最初の境目の直前に対応する 0 になる。
+遅延~段階における`入力~進捗~値$は 0 になるが、~animation時区間にまだ達していないことを指示するため，`直前~flag$は ~ON にされ†、~easing関数が生産する`出力~進捗~値$は，最初の境目の直前に対応する 0 になる。
【† どこでそのように規定されている？（次の段落も）】
◎
-During the delay phase, the input progress value will be zero but if the before flag is set to indicate that the animation has yet to reach its animation interval, the timing function will produce zero as its output progress value, i.e. the bottom of the first step.
+During the delay phase, the input progress value will be zero but if the before flag is set to indicate that the animation has yet to reach its animation interval, the easing function will produce zero as its output progress value, i.e. the bottom of the first step.
-~animationの時区間が始まる正確な瞬間における`入力~進捗~値$も，依然として 0 になるが、`直前~flag$は ~OFF にされるので，計時~関数の結果は 最初の境目の直後に対応することになる。
+~animationの時区間が始まる正確な瞬間における`入力~進捗~値$も，依然として 0 になるが、`直前~flag$は ~OFF にされるので，~easing関数の結果は 最初の境目の直後に対応することになる。
◎
-At the exact moment when the animation interval begins, the input progress value will still be zero, but the before flag will not be set and hence the result of the timing function will correspond to the top of the first step.
+At the exact moment when the animation interval begins, the input progress value will still be zero, but the before flag will not be set and hence the result of the easing function will correspond to the top of the first step.
@@ -1083,7 +1114,7 @@
2.3.1. 階段~計時~関数の出
~UAは、直列化の目的においては，依然として
`jump-start$v, `start$v
に対する結果を異らせるモノトスル（
-§ 直列化
+§ 直列化
を見よ）。
◎
Note: User agents must still differentiate between jump-start and start for the purpose of serialization (see §2.4 Serialization).
@@ -1183,25 +1214,25 @@
2.3.1. 階段~計時~関数の出
注記：
この段と 2 つ前の段は、所与の［
範囲 [0, 1] に入る`入力~進捗~値$
-］に対し，階段~計時~関数が［
+］に対し，階段~easing関数が［
範囲 [0, 1] に入らない`出力~進捗~値$
］を生産しないこと確保する。
◎
-Steps 4 and 6 in this procedure ensure that given an input progress value in the range [0, 1], a step timing function does not produce an output progress value outside that range.
+Steps 4 and 6 in this procedure ensure that given an input progress value in the range [0, 1], a step easing function does not produce an output progress value outside that range.
-例えば，`段~位置$が `jump-start$v にされた階段~計時~関数は、数学的には［
+例えば，`段~位置$が `jump-start$v にされた階段~easing関数は、数学的には［
`入力~進捗~値$ ~EQ 1
-］のときにも 境目の直後の段に上がる（すなわち 1 を超える）と直感的に期待できようが、そのような計時~関数は，~animationが前方へ延伸するとき（ `animation-fill-mode$p は `forwards^v ）には、`出力~進捗~値$として 1 を生産することが期待される。
+］のときにも 境目の直後の段に上がる（すなわち 1 を超える）と直感的に期待できようが、そのような~easing関数は，~animationが前方へ延伸するとき（ `animation-fill-mode$p は `forwards^v ）には、`出力~進捗~値$として 1 を生産することが期待される。
◎
-For example, although mathematically we might expect that a step timing function with a step position of jump-start would step up (i.e. beyond 1) when the input progress value is 1, intuitively, when we apply such a timing function to a forwards-filling animation, we expect it to produce an output progress value of 1 as the animation fills forwards.
+For example, although mathematically we might expect that a step easing function with a step position of jump-start would step up (i.e. beyond 1) when the input progress value is 1, intuitively, when we apply such an easing function to a forwards-filling animation, we expect it to produce an output progress value of 1 as the animation fills forwards.
-似たような状況は、`段~位置$が `jump-end$v にされた階段~計時~関数が，~animationの遅延~段階（ `animation-delay$p ）に適用されたときにも生じる。
+似たような状況は、`段~位置$が `jump-end$v にされた階段~easing関数が，~animationの遅延~段階（ `animation-delay$p ）に適用されたときにも生じる。
◎
-A similar situation arises for a step timing function with a step position of jump-end when applied to an animation during its delay phase.
+A similar situation arises for a step easing function with a step position of jump-end when applied to an animation during its delay phase.
@@ -1215,16 +1246,16 @@
2.3.1. 階段~計時~関数の出
-
+
2.4. 直列化
-計時~関数は
+~easing関数は
`CSSOM$r に定義される
共通の直列化~patternに加えて，次の追加的な要件を利用して直列化される：
◎
-Timing functions are serialized using the common serialization patterns defined in [CSSOM] with the following additional requirements:
+Easing functions are serialized using the common serialization patterns defined in [CSSOM] with the following additional requirements:
@@ -1238,11 +1269,11 @@
2.4. 直列化
-階段~計時~関数［
+階段~easing関数［
`steps()$f 関数 ／ `step-start$v ／ `step-end$v
］は、`段~位置$に応じて，次の形に直列化する：
◎
-Step timing functions, whether they are specified using the steps() function or either of the step-start or step-end keywords, are serialized as follows:
+Step easing functions, whether they are specified using the steps() function or either of the step-start or step-end keywords, are serialized as follows:
@@ -1265,31 +1296,39 @@
2.4. 直列化
+
+
3. ~privacy／~securityの考慮点
+
+
+この仕様は、他の仕様から参照できる共通の定義を供するものであり，~Web~platformに新たな能力を直に導入することはないので、~privacy／~securityの新たな懸念を導入することはない。
+◎
+This specification does not directly introduce any new capabilities to the Web platform but rather provides common definitions that may be referenced by other specifications. As a result, it does not introduce any new privacy and security concerns.
+
+
+
+~easing関数は、大概は，範囲 [0, 1] に入る`入力~進捗~値$をとり, 範囲 [0, 1] に入る`出力~進捗~値$を生産するが、常に，とは限らない。
+この仕様に定義される特色機能を参照している仕様は、それを考慮するベキである
+— ~easing関数の応用は、入力や出力がこの範囲に入らないときの挙動を定義して，新たな~security考慮点を導入しないことを確保するベキである。
+◎
+Specifications referencing the features defined in this specification should consider that while easing functions most commonly take an input progress value in the range [0,1] and produce an output progress value in the range [0, 1], this is not always the case. Applications of easing functions should define the behavior for inputs and outputs outside this range to ensure they do not introduce new security considerations.
+
+
+
-
3. 最後の発行版からの変更点
+
4. 最後の発行版からの変更点
-21 February 2017年 2月 21日 作業草案
+2018年 10月 9日 作業草案
からの変更点は：
◎
-The following changes have been made since the 21 February 2017 Working Draft:
+The following changes have been made since the 9 October 2018 Working Draft:
-`steps()$f 計時~関数に次に挙げる~keywordを追加した
-⇒
-`jump-start$v,
-`jump-end$v,
-`jump-none$v,
-`jump-both$v
+“`timing^en 関数（計時~関数）” を “~easing関数” に~~改称し、これらの関数が~animationのみに適用されると見做されないよう，もっと一般的な~~言葉で言い直した。
◎
-Added jump-start, jump-end, jump-none, and jump-both keywords to steps() timing function.
+Reworded specification to refer to “easing functions” rather than “timing functions” and use more general language that does not assume these functions are only applied to animations.
@@ -1324,4 +1363,3 @@
謝辞
-
diff --git a/css-easing/cubic-bezier-timing-curve.svg b/css-easing/cubic-bezier-easing-curve.svg
similarity index 100%
rename from css-easing/cubic-bezier-timing-curve.svg
rename to css-easing/cubic-bezier-easing-curve.svg
diff --git a/css-easing/timing-function-example.svg b/css-easing/easing-function-example.svg
similarity index 100%
rename from css-easing/timing-function-example.svg
rename to css-easing/easing-function-example.svg
diff --git a/css-easing/step-timing-func-examples.svg b/css-easing/step-easing-func-examples.svg
similarity index 100%
rename from css-easing/step-timing-func-examples.svg
rename to css-easing/step-easing-func-examples.svg
diff --git a/css-easing/step-timing-keyword-examples.svg b/css-easing/step-easing-keyword-examples.svg
similarity index 100%
rename from css-easing/step-timing-keyword-examples.svg
rename to css-easing/step-easing-keyword-examples.svg
diff --git a/css-images4-ja.html b/css-images4-ja.html
index 42e0d5060..f4e88b0cd 100644
--- a/css-images4-ja.html
+++ b/css-images4-ja.html
@@ -57,55 +57,47 @@
function create_html(match, key, indicator, klass){
if(!indicator) {//%
- return '' + match.slice(1) + '';
+ return `${match.slice(1)}`;
}
let text = key;
let href = '';
-let classname = class_map[klass];
-let tag = tag_map[klass];
-
switch(klass){
case 'r': // ref
- text = '[' + key + ']';
- href = '#biblio-' + key.toLowerCase();
+ text = `[${key}]`;
+ href = `#biblio-${key.toLowerCase()}`;
break;
case 't': // typedef
- text = '<' + key + '>';
+ text = `<${key}>`;
break;
case 'vt': // css values
- text = '<' + key + '>';
+ text = `<${key}>`;
break;
case 'f': // funcdef
- text = key + '()';
+ text = `${key}()`;
break;
case 'ft': // funcdef
- text = '<' + key + '()>';
+ text = `<${key}()>`;
klass='f';
break;
case 'P': // token
- text = '<' + key + '>';
- break;
-case 'L3':
- return (
-'
べきであることを意味する。
他の場合、 ~algoは，その補間の詳細な記述において，変数 %t を参照する。
これは、 0% から 100% へ進行する数値であり，遷移の［
-所要時間, 経過時間, 利用されている`計時~関数$
+所要時間, 経過時間, 利用されている`~easing関数$
］に基づく遷移の進捗を表現する値に設定される。
-例えば、`線型~計時~関数$と所要時間 1 秒の下では， 0.3 秒後の %t は 30% になる。
+例えば、`線型~easing関数$と所要時間 1 秒の下では， 0.3 秒後の %t は 30% になる。
◎
If an algorithm below simply states that two values should be "interpolated" or "transitioned" without further details, then the value should be interpolated as described by the Transitions spec. Otherwise, the algorithm may reference a variable t in its detailed description of the interpolation. This is a number which starts at 0% and goes to 100%, and is set to a value that represents the progress through the transition, based on the duration of the transition, the elapsed time, and the timing function in use. For example, with a linear timing function and a 1s duration, after .3s t is equal to 30%.
@@ -3101,7 +3092,11 @@
8. 直列化
~privacy／~security上の考慮点
-`privsec^L3
+
注記：
+`css3-images$r と同じ。
+◎
+Note: No change from [css3-images].
+
diff --git a/css-transitions-ja.html b/css-transitions-ja.html
index ec0e65602..f43297a8c 100644
--- a/css-transitions-ja.html
+++ b/css-transitions-ja.html
@@ -87,32 +87,30 @@
function create_html(match, key, indicator, klass){
if(!indicator) {//%
- return '' + match.slice(1) + '';
+ return `${match.slice(1)}`;
}
let text = key;
let href = '';
-let classname = class_map[klass];
-let tag = tag_map[klass];
switch(klass){
case 'r': // ref
- text = '[' + key + ']';
- href = '#biblio-' + key.toLowerCase();
+ text = `[${key}]`;
+ href = `#biblio-${key.toLowerCase()}`;
break;
case 't': // typedef
- text = '<' + key + '>';
+ text = `<${key}>`;
break;
case 'p': // property
break;
case 'ps': // pseudo-class
- text = ':' + key;
+ text = `:${key}`;
break;
case 'pe': // pseudo-element
- text = '::' + key;
+ text = `::${key}`;
break;
case 'cd': // 条件
- text = '［' + key + '］';
+ text = `［${key}］`;
break;
case 'm': // IDL member
let n = text.indexOf('(');
@@ -121,22 +119,21 @@
text = key + text.slice(n).replace(/\w+/g, '$&');
}
break;
-case 'en': // english words
- return '' + key + ''
+case 'en':
+ return `${key}`;
break;
default:
}
-
+let tag = tag_map[klass];
if(tag) {
- text = '<' + tag + (
- classname ? ' class="' + classname + '"' : ''
- ) + '>' + text + '';
+ let classname = class_map[klass];
+ classname = classname ? ` class="${classname}"` : '';
+ text = `<${tag}${classname}>${text}`;
}
-
if(indicator !== '^'){
- href = link_map[klass ? (klass + '.' + key) : key] || href;
+ href = link_map[ klass ? `${klass}.${key}` : key ] || href;
if(!href){
console.log(match); // check error
return match;
@@ -144,10 +141,10 @@
switch(indicator){
case '$':
- text = '' + text + '';
+ text = `${text}`;
break;
case '@':
- text = '' + text + '';
+ text = `${text}`;
break;
}
}
@@ -240,7 +237,7 @@
t.single-transition:#single-transition
t.single-transition-property:#single-transition-property
-t.timing-function:~CSSEASING#typedef-timing-function
+t.easing-function:~CSSEASING#typedef-easing-function
t.custom-ident:~CSSVAL#identifier-value
t.time:~CSSVAL#time-value
@@ -249,7 +246,7 @@
timing function＊
-v.ease:~CSSEASING#valdef-cubic-bezier-timing-function-ease
+v.ease:~CSSEASING#valdef-cubic-bezier-easing-function-ease
v.none:#valdef-transition-property-none
v.all:#valdef-transition-property-all
@@ -335,7 +332,7 @@
V.所要時間:#matching-transition-duration
V.遅延:#matching-transition-delay
-V.計時~関数:#matching-transition-timing-function
+V.~easing関数:#matching-transition-easing-function
合計の所要時間:#transition-combined-duration
現在-値:#current-value
@@ -351,8 +348,8 @@
入力~進捗~値:~CSSEASING#input-progress-value
出力~進捗~値:~CSSEASING#output-progress-value
-階段~計時~関数:~CSSEASING#step-timing-function
-計時~関数:~CSSEASING#timing-function
+階段~easing関数:~CSSEASING#step-easing-function
+~easing関数:~CSSEASING#easing-function
DOM Event:~DOM4#interface-event
@@ -511,8 +508,8 @@
~animate可能:animatable
animation:::アニメーション
transition-property:
-
index:
+easing:
遷移:transition::~
遷移-:transition::~
@@ -542,7 +539,6 @@
時刻:time::~
時間:time:~
時機:timing::~
-計時:timing::~
開始値:starting value:start 値:~
所要時間:duration::~
@@ -1384,7 +1380,7 @@
2.3. `transition-timing-func
`transition-timing-function$p
~propは、遷移の間の中途の値がどの時点で利用されるかを算出する方法を述べる。
これにより，その間の遷移の速度を変化させられるようになる。
-これらの効果は、共通的に easing 関数と呼ばれる。
+これらの効果は、共通的に ~easing 関数と呼ばれる。
◎
The transition-timing-function property describes how the intermediate values used during a transition will be calculated. It allows for a transition to change speed over its duration. These effects are commonly called easing functions.
注記：
これは、古い遷移において，`逆再生調整後の開始~値$から`終止~値$まで辿られた値~空間の部位を表現する（時間の長さではなく） — ただし，［
%y1, %y2 のいずれかが [0, 1] 区間の外にあるとき
-］の`計時~関数$を取扱う際における，絶対~値と切詰めによる部分は除外される。
+］の`~easing関数$を取扱う際における，絶対~値と切詰めによる部分は除外される。
◎
Note: This represents the portion of the space between the reversing-adjusted start value and the end value that the old transition has traversed (in amounts of the value, not time), except with the absolute value and clamping to handle timing functions that have y1 or y2 outside the range [0, 1].
3.1. 中断された遷
］に生じる遷移など。
これらの効果は、稼働中の遷移が完了する前に中断され, ~propが遷移の開始~値に再設定されることが，共通して生じ得る。
例えば、要素~上の~hover効果において，~mouse-pointerが要素に入ったときに遷移が開始され，効果が完了する前に要素から出たときなど。
-中断された遷移と後から来る遷移が，同じ`所要時間$と`計時~関数$を利用して実行される場合、後者の遷移は，短縮された距離を 指定された時間~全部をかけて移動するので、結果の効果は 予想に反して非対称になり得る。
+中断された遷移と後から来る遷移が，同じ`所要時間$と`~easing関数$を利用して実行される場合、後者の遷移は，短縮された距離を 指定された時間~全部をかけて移動するので、結果の効果は 予想に反して非対称になり得る。
この仕様では、代わりに， 2 回目の遷移にかける時間を短縮する。
◎
Many common transitions effects involve transitions between two states, such as the transition that occurs when the mouse pointer moves over a user interface element, and then later moves out of that element. With these effects, it is common for a running transition to be interrupted before it completes, and the property reset to the starting value of that transition. An example is a hover effect on an element, where a transition starts when the pointer enters the element, and then the pointer exits the element before the effect has completed. If the outgoing and incoming transitions are executed using their specified durations and timing functions, the resulting effect can be distractingly asymmetric because the second transition takes the full specified time to move a shortened distance. Instead, this specification makes second transition shorter.
@@ -2410,8 +2406,8 @@
3.1. 中断された遷
注記：
-これらの規則により、新たな遷移の`計時~関数$は，その全体（の定義域）が利用される
-— 計時~関数の中途にジャンプするのではなく（その場合，目障りな効果が生じ得る）。
+これらの規則により、新たな遷移の`~easing関数$は，その全体（の定義域）が利用される
+— ~easing関数の中途にジャンプするのではなく（その場合，目障りな効果が生じ得る）。
◎
Note that these rules lead to the entire timing function of the new transition being used, rather than jumping into the middle of a timing function, which can create a jarring effect.
-`計時~関数$の効果に因り， %p の範囲は開区間 (−∞, ∞) にわたる。
+`~easing関数$の効果に因り， %p の範囲は開区間 (−∞, ∞) にわたる。
よって，この手続きは、閉区間 [0, 1] の外側にある %p に対しても外挿の挙動を定義しなければナラナイ。
◎
The range of p is (−∞, ∞) due to the effect of timing functions. As a result, this procedure must also define extrapolation behavior for p outside [0, 1].
@@ -2771,7 +2771,7 @@
4.2. 作
`animation-timing-function$p: `ease-in$v;
`animation-name$p: `ease-out$v;
に等価になる。
-`ease-in$v は， `animation-timing-function$p に属する `timing-function$t 生成規則に該当する結果、
+`ease-in$v は， `animation-timing-function$p に属する `easing-function$t 生成規則に該当する結果、
`ease-out$v は， `animation-name$p に属する `custom-ident$t 生成規則に該当するようになる。
◎
For example, the shorthand declaration animation: ease-in ease-out is equivalent to the longhand declarations animation-timing-function: ease-in; animation-name: ease-out;. ease-in is claimed by the <timing-function> production belonging to animation-timing-function, leaving ease-out to be claimed by the <custom-ident> production belonging to animation-name.
diff --git a/web-animations-api-ja.html b/web-animations-api-ja.html
index a5b295ed0..0cc56801b 100644
--- a/web-animations-api-ja.html
+++ b/web-animations-api-ja.html
@@ -46,32 +46,26 @@
match = match.slice(1);
const n = match.indexOf('\/');
if(n <= 0) {
- return '' + match + '';
+ return `${match}`;
}
return (
-''
-+ match.slice(0, n)
-+ ''
-+ match.slice(n+1)
-+ ''
+`${match.slice(0, n)}${match.slice(n+1)}`
); // 添え字付き
}
let text = key;
let href = '';
-let classname = class_map[klass];
-let tag = tag_map[klass];
switch(klass){
case 'r': // ref
- text = '[' + key + ']';
-// href = '#biblio-' + key.toLowerCase();
+ text = `[${key}]`;
+// href = `#biblio-${key.toLowerCase()}`;
break;
case 't': // typedef
- text = '<' + key + '>';
+ text = `<${key}>`;
break;
case 'pe': // pseudo-element
- text = '::' + key;
+ text = `::${key}`;
break;
case 'I': // set local context ( and context if @ )
@@ -79,7 +73,7 @@
if( indicator === '@'){
ctx_ifc = ctx_ifc1;
}
-// href = '#' + ctx_ifc1;
+// href = `#${ctx_ifc1}`;
break;
case 'II': // only set local context
ctx_ifc1 = key.toLowerCase();
@@ -102,57 +96,58 @@
}
switch(klass){
case 'm':
- href = '#dom-' + ctx_ifc + '-' + key.toLowerCase();
+ href = `#dom-${ctx_ifc}-${key.toLowerCase()}`;
break;
case 'm1':
- href = '#dom-' + ctx_ifc1 + '-' + key.toLowerCase();
+ href = `#dom-${ctx_ifc1}-${key.toLowerCase()}`;
break;
case 'm0':
- href = '#dom-' + key.toLowerCase() + '-' + key.toLowerCase();
+ href = `#dom-${key.toLowerCase()}-${key.toLowerCase()}`;
break;
}
// klass = 'm';
break;
case 'mC':
- href = '#dom-' + key.toLowerCase() + '-' + key.toLowerCase();
+ href = `#dom-${key.toLowerCase()}-${key.toLowerCase()}`;
text = 'Constructor';
break;
case 'l': // literal / IDL enum
case 'l1':
- text = '"' + text + '"';
+ text = `"${text}"`;
switch(klass) {
case 'l':
- href = '#dom-' + ctx_ifc + '-' + key.toLowerCase();
+ href = `#dom-${ctx_ifc}-${key.toLowerCase()}`;
break;
case 'l1':
- href = '#dom-' + ctx_ifc1 + '-' + key.toLowerCase();
+ href = `#dom-${ctx_ifc1}-${key.toLowerCase()}`;
break;
}
break;
case 'sl': // internal slot
- text = '[[' + key + ']]';
+ text = `[[${key}]]`;
break;
-case 'en': // english words
- return '' + key + ''
+case 'en':
+ return `${key}`;
break;
case 'sec':
- text = '§ ' + text;
+ text = `§ ${text}`;
break;
case 'issue':
- text = 'issue#' + key;
- href = '~CSSissue/' + key;
+ text = `issue#${key}`;
+ href = `~CSSissue/${key}`;
break;
default:
}
+let tag = tag_map[klass];
if(tag) {
- text = '<' + tag + (
- classname ? ' class="' + classname + '"' : ''
- ) + '>' + text + '';
+ let classname = class_map[klass];
+ classname = classname ? ` class="${classname}"` : '';
+ text = `<${tag}${classname}>${text}`;
}
if(indicator !== '^'){
- href = link_map[klass ? (klass + '.' + key) : key] || href;
+ href = link_map[ klass ? `${klass}.${key}` : key ] || href;
if(!href){
console.log(match); // check error
return match;
@@ -160,10 +155,10 @@
switch(indicator){
case '$':
- text = '' + text + '';
+ text = `${text}`;
break;
case '@':
- text = '' + text + '';
+ text = `${text}`;
break;
}
}
@@ -484,7 +479,7 @@
p.offset:https://drafts.fxtf.org/motion-1/#propdef-offset
t.custom-property-name:~CSSVAR#typedef-custom-property-name
-t.timing-function:~CSSEASING#typedef-timing-function
+t.easing-function:~CSSEASING#typedef-easing-function
r.CSS-EASING-1:~WANIM#biblio-css-easing-1
@@ -658,7 +653,7 @@
時刻~起点:~HRTIME#dfn-time-origin
時刻~起点:~HRTIME#time-origin
-計時~関数:~CSSEASING#timing-function
+~easing関数:~CSSEASING#easing-function
~THROW:~WEBIDL#dfn-throw
投出され:~WEBIDL#dfn-throw
在する:~WEBIDL#dfn-present
@@ -704,6 +699,7 @@
終止-:end:::~
終端:end:::~
区間:interval:::~
+ナシ:none::~
前方:forwards:::~
後方:backwards:::~
両方:both:::~
@@ -2218,7 +2214,7 @@
6.5.1. `Effec
計時~計算を遂行するときには、特別な文字列~値 `auto^l は，`計時~model$secにより認識されるいずれかの`延伸~mode$に展開される
— すなわち，次に対応する`延伸~mode$を利用する
⇒＃
-当の`~animation効果$は`~keyframe効果$であるならば `なし^i （ `none^l ）／
+当の`~animation効果$は`~keyframe効果$であるならば `ナシ^i （ `none^l ）／
~ELSE_ `両方^i （ `both^l ）
◎
When performing timing calculations the special string value auto is expanded to one of the fill modes recognized by the timing model as follows,
@@ -2334,13 +2330,13 @@
6.5.1. `Effec
easing, of type DOMString, defaulting to "linear"
-`計時~関数$を与える
+`~easing関数$を与える
— それは、時刻を伸縮して，加減速（ `easing^en ）効果を生産するために利用される。
◎
The timing function used to scale the time to produce easing effects.
-文字列の構文は、 `timing-function$t 生成規則により定義される。
+文字列の構文は、 `easing-function$t 生成規則により定義される。
`CSS-EASING-1$r
◎
The syntax of the string is defined by the <timing-function> production [CSS-EASING-1].
@@ -2503,8 +2499,8 @@
-計時~関数は，連続する 2 つの~keyframeの`合間に^em適用されるので、最後の~keyframe上に計時~関数を指定しても，無視されることになる。
+~easing関数は，連続する 2 つの~keyframeの`合間に^em適用されるので、最後の~keyframe上に~easing関数を指定しても，無視されることになる。
次の 2 つは、同じ結果を生産する：
◎
// Since timing functions apply _between_ keyframes, even if we specify a a timing function on the last keyframe it will be ignored.
@@ -3568,13 +3564,13 @@
6.6.3. %keyframes 引数の処理-
-どちらの形でも、 `easing^c ~propは，`~keyframeに特有の計時~関数^emを設定することに注意。
+どちらの形でも、 `easing^c ~propは，`~keyframeに特有の~easing関数^emを設定することに注意。
これは、
-`EffectTiming$I ~objを利用して指定された`計時~関数$からは独立になる
-— 後者の計時~関数は、`~keyframe効果$の`反復~所要時間$全体に適用される。
+`EffectTiming$I ~objを利用して指定された`~easing関数$からは独立になる
+— 後者の~easing関数は、`~keyframe効果$の`反復~所要時間$全体に適用される。
◎
Note that the easing property in either form sets the keyframe-specific timing function. This is independent from the timing function that applies to the entire iteration duration of the keyframe effect as specified using a KeyframeEffectOptions object (or KeyframeAnimationOptions object when using the animate() method of the Animatable interface mixin).
4.8.1. 概観
(5) The simple iteration progress is converted into a directed progress by incorporating the playback direction.
-最後に、`有向~進捗$に計時~関数が適用され，`変形d進捗$を生産する。
+最後に、`有向~進捗$に~easing関数が適用され，`変形d進捗$を生産する。
◎
(6) Finally, a timing function is applied to the directed progress to produce the transformed progress.
［
`~animation効果$が進捗する~rate
］を制御したいと欲されることは多い。
-例えば，~animationの~rateの加減速（ `easing^en ）は、慣性感のある より自然な効果を生産する。
-`CSS-EASING-1$r は、この目的に`計時~関数$を定義する。
+例えば，~animationの~rateの~easing（加減速）は、慣性感のある より自然な効果を生産する。
+`CSS-EASING-1$r は、この目的に`~easing関数$を定義する。
◎
It is often desirable to control the rate at which an animation effect progresses. For example, easing the rate of animation can create a sense of momentum and produce a more natural effect. The CSS Timing Functions Module [CSS-EASING-1] defines timing functions for this purpose.
-各`~animation効果$には、`計時~関数$が結付けられる。
-既定の`計時~関数$は、`線形~計時~関数$とする。
+各`~animation効果$には、`~easing関数$が結付けられる。
+既定の`~easing関数$は、`線形~easing関数$とする。
◎
Animation effects have one timing function associated with them. The default timing function is the linear timing function.
-各~keyframeには，`計時~関数$も結付けられ、その~keyframeから~list内の次の~keyframeまでの期間に適用される。
-~list内で最後の~keyframeに指定された`計時~関数$は、決して適用されない。
+各~keyframeには，`~easing関数$も結付けられ、その~keyframeから~list内の次の~keyframeまでの期間に適用される。
+~list内で最後の~keyframeに指定された`~easing関数$は、決して適用されない。
◎
Each keyframe also has a timing function associated with it that is applied to the period of time between the keyframe on which it is specified and the next keyframe in the list. The timing function specified on the last keyframe in the list is never applied.
@@ -8647,7 +8648,7 @@
5.3.3. ~keyframe効果の効
Let interval distance be the result of evaluating (iteration progress - start offset) / (end offset - start offset).
-ある種の計時~関数が在る下では、~animation効果への入力~反復~進捗は，範囲 [0, 1] 内に制限されない。
+ある種の~easing関数が在る下では、~animation効果への入力~反復~進捗は，範囲 [0, 1] 内に制限されない。
しかしながら，現時点では、~keyframe~offsetはこの範囲~内に制限され，この範囲の外側にある入力~反復~進捗~値~用の~prop値は 単純に外挿される。
◎
In the presence of certain timing functions, the input iteration progress to an animation effect is not limited to the range [0, 1]. Currently, however, keyframe offsets are limited to the range [0, 1] and property values are simply extrapolated for input iteration progress values outside this range.
@@ -8731,13 +8732,13 @@
5.3.3. ~keyframe効果の効
［
~prop値における範囲 [0, 1] の外側の反復~進捗~値に線形でない変化を指定-可能になる
］のが有用になるような事例も存在するので、この制約を除去することも考えた。
-例として、緑色から黄色へ補間するが，一時的に黄色を “通り越して” 赤色へ補間されるよう，計時~関数を外へ振り切らせる~animationが挙げられる。
+例として、緑色から黄色へ補間するが，一時的に黄色を “通り越して” 赤色へ補間されるよう，~easing関数を外へ振り切らせる~animationが挙げられる。
◎
We have considered removing this restriction since some cases exist where it is useful to be able to specify non-linear changes in property values at iteration progress values outside the range [0, 1]. One example is an animation that interpolates from green to yellow but has an overshoot timing function that makes it temporarily interpolate ‘beyond’ yellow to red before settling back to yellow.
-この効果は~keyframeと計時~関数を改変して達成することもできるが、そのような~approachは，~modelにおける計時への~~関心を~animation効果から分離する~~原則を壊すように見受けられる。
+この効果は~keyframeと~easing関数を改変して達成することもできるが、そのような~approachは，~modelにおける計時への~~関心を~animation効果から分離する~~原則を壊すように見受けられる。
◎
While this effect could be achieved by modification of the keyframes and timing function, this approach seems to break the model’s separation of timing concerns from animation effects.
@@ -538,10 +565,10 @@