joachim/openwebrx-clone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use transform for better performance

Browse Source
This commit is contained in:
Jakob Ketterl 2021-01-02 17:53:54 +01:00
parent 44f4532452
commit 9d89cbceed
2 changed files with 4 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
htdocs/css/openwebrx.css
View File

@ -559,13 +559,11 @@ img.openwebrx-mirror-img
border-radius: 5px;
height: 100%;
width: 100%;
position: absolute;
left: -100%;
transition-property: left,background-color;
transition-property: transform, background-color;
transition-duration: 1s;
transition-timing-function: ease-in-out;
transform: translateZ(0);
will-change: left;
transform: translate(-100%) translateZ(0);
will-change: transform, background-color;
}
.openwebrx-progressbar--over .openwebrx-progressbar-bar {

2
htdocs/lib/ProgressBar.js
View File

@ -18,7 +18,7 @@ ProgressBar.prototype.set = function(val, text, over) {
ProgressBar.prototype.setValue = function(val) {
if (val < 0) val = 0;
if (val > 1) val = 1;
this.$innerBar.css({left: (val - 1) * 100 + '%'});
this.$innerBar.css({transform: 'translate(' + ((val - 1) * 100) + '%) translateZ(0)'});
};
ProgressBar.prototype.setText = function(text) {