Por favor, ¿dónde me estoy equivocando? Estoy tratando de cambiar la base de la barra de progreso en la variable y no funciona.
<script> function grafWidth(GtempPar) { var GtempPar = 30; document.getElementById('progress-in').style.width = GtempPar + "px"; } </script> <div class="progress"> <a class="majko">Temp_G_back</a> <span class="progress-val"><div id="Gtemp"></div>°C</span> <span class="progress-bar"><span class="progress-in".style.width =" 80px"></span></span> </div>La razón más probable es que el intervalo es un elemento en línea y, como tal, no puede especificar un ancho (o márgenes/relleno/altura, etc.). Para aplicar el estilo, intente hacer que el intervalo se muestre y: inline-block y debería poder aplicar los cambios de ancho como se esperaba.
Además, el intervalo tiene una identificación, no una clase, y debe llamar a la función con un argumento de que desea pasar a la función. y la var dentro de la función es redundante.
function grafWidth(GtempPar) { document.getElementById('progress-in').style.width = GtempPar + "px"; } grafWidth(150); // this calls the function and passes 150 in to set the width of the progress bar to 150px (out of 200) span { display: inline-block; } .progress-bar { border: solid 1px blue; width: 200px; height: 32px } #progress-in { background: red; position: relative; z-index: 1; width: 100px; height: 32px; } <div class="progress"> <a class="majko">Temp_G_back</a> <span class="progress-val"><div id="Gtemp"></div>°C</span> <span class="progress-bar"><span id="progress-in"></span></span> </div>