Question

基本上我需要使用jquery或javascript调用.range::-webkit-slider-runnable-track，这样我就可以对其背景进行一些更改并对其进行其他实现。

准确地说，我目前正在使用

$('<style>.myrange::-webkit-slider-runnable-track{background:linear-gradient(to right, white'+val+'%, #bbb '+val+'%);}</style>').appendTo('head');

这个工作非常好，但问题是，我每次都会调用.myrange::-webkit-slider-runnable-track几千次，每次它都会增加我的范围，因此会遇到一些性能问题。< / p>

如果有人告诉我如何使用$('.myrange::-webkit-slider-runnable-track').css("background", "black");

这样的话，我真的很感激

问题更新：

<input type="range" value="0" min="0" max="100" id="myrange" class="myrange"/>

此range已连接到视频，该视频会跟踪视频持续时间并将曲目的颜色更改为视频已被观看的位置。

要做范围跟踪器的着色，这就是我正在做的事情：

vid.addEventListener('progress', function() {
    var range = 0;
    var bf = this.buffered;
    var time = this.currentTime;

    while(!(bf.start(range) <= time && time <= bf.end(range))) {
        range += 1;
    }
    var loadStartPercentage = bf.start(range) / this.duration;
    var loadEndPercentage = bf.end(range) / this.duration;
   var loadPercentage = loadEndPercentage -      loadStartPercentage;

   val = loadPercentage*100;
   thmpos = $('.vidskb_r').val();
   var style = $("<style>", {type:"text/css"}).appendTo("head");
   style.text('.vidskb_r::-webkit-slider-runnable-track{background:linear-gradient(to right, #ff7e20 '+thmpos+'%, #fff '+thmpos+'%, #fff '+val+'%, #bbb '+val+'%);}');

});

提前致谢：）

Answer 1

将sudo apt-get install libffi-dev文字附加到单个css元素，将<style>替换为.text()

注意，您不需要在循环或事件处理程序的每次迭代中创建新的.append()元素。在循环或事件处理程序之外创建<style>元素，并使用变量引用循环或事件处理程序中的单个<style>元素。

<style>

如何调用范围:: - webkit-slider-runnable-track？

1 个答案: