Как сделать индикатор выполнения

Question

Как сделать индикатор выполнения

Во многих случаях требуется точка с запятой.

Что если бы у вас было:

int *y;
int f = 1
*y = 2;

Это было бы проанализировано как

int *y;
int f = 1 * y = 2;

Так что без точек с запятой это неоднозначно.

35

css javascript html progress-bar

задан Linus Caldwell 24 May 2013 в 23:38

1 ответ

Другие вопросы по тегам:

css javascript html progress-bar

Похожие вопросы:

score 0 · Answer 1

Я описывал ответ на подобный вопрос, который был удален, таким образом, я отправляю его здесь в случае, если он полезен для любого.

разметке можно заглядывать где угодно и поднимает 50 пкс вертикальной недвижимости, даже когда скрытый. (Чтобы иметь его не занимают вертикального места и вместо этого накладывают главных 50 пкс, мы можем просто дать progressContainerDiv абсолютное расположение (в любом расположенном элементе) и разработать display свойство вместо visible свойство.)

общая структура основана на коде, представленном в это Фанаты для статьи .

const
  progressContainerDiv = document.getElementById("progressContainerDiv");
  progressShownDiv = document.getElementById("progressShownDiv");
let
  progress = 0,
  percentageIncrease = 10;

function animateProgress(){
  progressContainerDiv.style.visibility = "visible";
  const repeater = setInterval(increaseRepeatedly, 100);
  function increaseRepeatedly(){
    if(progress >= 100){
      clearInterval(repeater);
      progressContainerDiv.style.visibility = "hidden";
      progressNumberSpan.innerHTML = "";
      progress = 1;
    }
    else{
      progress = Math.min(100, progress + percentageIncrease);
      progressShownDiv.style.width = progress + "%";
      progressNumberSpan.innerHTML = progress + "%";
    }
  }
}

#progressContainerDiv{
  visibility: hidden;
  height: 40px;
  margin: 5px;
}

#progressBackgroundDiv {
  width: 50%;
  margin-left: 24%;
  background-color: #ddd;
}
  
#progressShownDiv {
  width: 1%;
  height: 20px;
  background-color: #4CAF50;
}

#progressNumberSpan{
  margin: 0 auto;
}

<div id="progressContainerDiv">
  <div id="progressBackgroundDiv">
    <div id="progressShownDiv"></div>
  </div>
  <div id="progressNumberContainerDiv">
    <span id="progressNumberSpan"></span>
  </div>
</div>
<button type="button" onclick="animateProgress()">Go</button>
<div id="display"></div>

Geeks