回答編集履歴
2
jQueryのdelayメソッドを使わなくてもタイミングを合わせられるので、削除
test
CHANGED
|
@@ -82,6 +82,8 @@
|
|
|
82
82
|
|
|
83
83
|
const navStyle = window.getComputedStyle(navDom);
|
|
84
84
|
|
|
85
|
+
// 画面幅が、960px以上だと、0か、数値にならないとなるので、その場合は、600が入るようにした。
|
|
86
|
+
|
|
85
87
|
const navTransitionDuration = (isNaN(parseFloat(navStyle.transitionDuration)) || parseFloat(navStyle.transitionDuration) == 0 ? 0.6 : parseFloat(navStyle.transitionDuration)) * 1000;
|
|
86
88
|
|
|
87
89
|
// heightに効かせたインナースタイルをタイミングよく解除するためのタイマーを用意
|
|
@@ -102,9 +104,9 @@
|
|
|
102
104
|
|
|
103
105
|
} else {
|
|
104
106
|
|
|
105
|
-
// クラスを外す時、強制的に表示状態を保つため、heightのインナースタイルを効かせつつ、クラスを外す。
|
|
107
|
+
// クラスを外す時、強制的に表示状態を保つため、heightのインナースタイルを効かせつつ、クラスを外す。
|
|
106
108
|
|
|
107
|
-
$('.NavMenu').css('height', 'auto').removeClass('active')
|
|
109
|
+
$('.NavMenu').css('height', 'auto').removeClass('active'); //クラスを外す
|
|
108
110
|
|
|
109
111
|
// transitionアニメーションが終了したタイミングで、heightインナースタイルを外すようタイターセット
|
|
110
112
|
|
|
@@ -113,6 +115,8 @@
|
|
|
113
115
|
clearTimeout(classDelTimer);
|
|
114
116
|
|
|
115
117
|
}
|
|
118
|
+
|
|
119
|
+
// transition時間プラス0.1秒とすることで、処理遅延が多少出ても、違和感をなくせる
|
|
116
120
|
|
|
117
121
|
classDelTimer = setTimeout(function(){
|
|
118
122
|
|
1
transitionDurationが、0や、数値にならなかった時の対応を追記した
test
CHANGED
|
@@ -82,7 +82,7 @@
|
|
|
82
82
|
|
|
83
83
|
const navStyle = window.getComputedStyle(navDom);
|
|
84
84
|
|
|
85
|
-
const navTransitionDuration = parseFloat(navStyle.transitionDuration) * 1000;
|
|
85
|
+
const navTransitionDuration = (isNaN(parseFloat(navStyle.transitionDuration)) || parseFloat(navStyle.transitionDuration) == 0 ? 0.6 : parseFloat(navStyle.transitionDuration)) * 1000;
|
|
86
86
|
|
|
87
87
|
// heightに効かせたインナースタイルをタイミングよく解除するためのタイマーを用意
|
|
88
88
|
|