Fossil SCM
Timing tweaks: made "hide borders" hack occur about the same time as the CSS transition finishes, and increased the menu show delay still further to make it work for Firefox.
Commit
7bb68023bdde3fe63f0f7360f215439a0c096897f65edeaccc6fbc451774c1f5
Parent
e76a243da982e83…
1 file changed
+4
-4
+4
-4
| --- skins/default/footer.txt | ||
| +++ skins/default/footer.txt | ||
| @@ -45,11 +45,11 @@ | ||
| 45 | 45 | // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions#JavaScript_examples |
| 46 | 46 | function showPanel() { |
| 47 | 47 | setTimeout(function() { |
| 48 | 48 | panel.style.maxHeight = panelHeight; |
| 49 | 49 | panel.style.border = panelBorder; |
| 50 | - }, 25); // 10 is insufficient with Firefox 62 | |
| 50 | + }, 40); // 10ms is insufficient with Firefox 62 | |
| 51 | 51 | } |
| 52 | 52 | |
| 53 | 53 | // Click handler for the hamburger button. |
| 54 | 54 | var needSitemapHTML = true; |
| 55 | 55 | document.querySelector("div.mainmenu > a").onclick = function() { |
| @@ -56,14 +56,14 @@ | ||
| 56 | 56 | if (panel.style.maxHeight == panelHeight) { |
| 57 | 57 | // Hamburger button clicked while panel visible. Trigger the |
| 58 | 58 | // transition back to hidden state. |
| 59 | 59 | panel.style.maxHeight = '0'; |
| 60 | 60 | setTimeout(function() { |
| 61 | - // Browsers show a 1px high line when maxHeight == 0, so | |
| 62 | - // temporarily hide the borders while hidden. | |
| 61 | + // Browsers show a 1px high border line when maxHeight == 0, | |
| 62 | + // our "hidden" state, so hide the borders in that state, too. | |
| 63 | 63 | panel.style.border = 'none'; |
| 64 | - }, 300); | |
| 64 | + }, 500); // same as transition time below | |
| 65 | 65 | } |
| 66 | 66 | else if (needSitemapHTML) { |
| 67 | 67 | // Only get it once per page load: it isn't likely to |
| 68 | 68 | // change on us. |
| 69 | 69 | var xhr = new XMLHttpRequest(); |
| 70 | 70 |
| --- skins/default/footer.txt | |
| +++ skins/default/footer.txt | |
| @@ -45,11 +45,11 @@ | |
| 45 | // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions#JavaScript_examples |
| 46 | function showPanel() { |
| 47 | setTimeout(function() { |
| 48 | panel.style.maxHeight = panelHeight; |
| 49 | panel.style.border = panelBorder; |
| 50 | }, 25); // 10 is insufficient with Firefox 62 |
| 51 | } |
| 52 | |
| 53 | // Click handler for the hamburger button. |
| 54 | var needSitemapHTML = true; |
| 55 | document.querySelector("div.mainmenu > a").onclick = function() { |
| @@ -56,14 +56,14 @@ | |
| 56 | if (panel.style.maxHeight == panelHeight) { |
| 57 | // Hamburger button clicked while panel visible. Trigger the |
| 58 | // transition back to hidden state. |
| 59 | panel.style.maxHeight = '0'; |
| 60 | setTimeout(function() { |
| 61 | // Browsers show a 1px high line when maxHeight == 0, so |
| 62 | // temporarily hide the borders while hidden. |
| 63 | panel.style.border = 'none'; |
| 64 | }, 300); |
| 65 | } |
| 66 | else if (needSitemapHTML) { |
| 67 | // Only get it once per page load: it isn't likely to |
| 68 | // change on us. |
| 69 | var xhr = new XMLHttpRequest(); |
| 70 |
| --- skins/default/footer.txt | |
| +++ skins/default/footer.txt | |
| @@ -45,11 +45,11 @@ | |
| 45 | // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions#JavaScript_examples |
| 46 | function showPanel() { |
| 47 | setTimeout(function() { |
| 48 | panel.style.maxHeight = panelHeight; |
| 49 | panel.style.border = panelBorder; |
| 50 | }, 40); // 10ms is insufficient with Firefox 62 |
| 51 | } |
| 52 | |
| 53 | // Click handler for the hamburger button. |
| 54 | var needSitemapHTML = true; |
| 55 | document.querySelector("div.mainmenu > a").onclick = function() { |
| @@ -56,14 +56,14 @@ | |
| 56 | if (panel.style.maxHeight == panelHeight) { |
| 57 | // Hamburger button clicked while panel visible. Trigger the |
| 58 | // transition back to hidden state. |
| 59 | panel.style.maxHeight = '0'; |
| 60 | setTimeout(function() { |
| 61 | // Browsers show a 1px high border line when maxHeight == 0, |
| 62 | // our "hidden" state, so hide the borders in that state, too. |
| 63 | panel.style.border = 'none'; |
| 64 | }, 500); // same as transition time below |
| 65 | } |
| 66 | else if (needSitemapHTML) { |
| 67 | // Only get it once per page load: it isn't likely to |
| 68 | // change on us. |
| 69 | var xhr = new XMLHttpRequest(); |
| 70 |